mtcodex

Optimising iTunes style list filter in Flash

• home
• work
• about
• journal
• contact

Optimising iTunes style list filter in Flash Tuesday evening, 22 March 2005

I've recently had cause to have a DataGrid which is not only sortable but can be filtered by typing into a Text Input (much like iTunes).

So I decided on using a DataSet to hold the records and then using the DataSet.filterFunc() method to exclude results which don't match what's being typed into the Text Input.

It soon struck me- what happens if there are not six records but 600!? So I decided to try three different methods of filtering to see which is the best.

/**
* Called on text input change to filter a DataSet
*
* @author: Matt Turner
* @version: 0.1
*/
private function filterResults(){
    
    /* Start filtering dataset*/
    m_mainListDS.filtered = true;

    /* Get input text value*/
    var filterText = m_filterTF.text.toLowerCase();

    /* Filter Items*/
    m_mainListDS.filterFunc = function(item:Object):Boolean
    {

        /* Option 1 */
        /* Test individually to get quicker return */
        //+
        if(filterText == ""){
            return true;
        }
        if(item.Level.toLowerCase().indexOf(filterText) != -1){
            return true;
        }
        if(item.Name.toLowerCase().indexOf(filterText) != -1){
            return true;
        }
        if(item.Type.toLowerCase().indexOf(filterText) != -1){
            return true;
        }
        //-


        /* Option 2 */
        /* Test in one evaluation*/
        //+
        if
        (item.Level.toLowerCase().indexOf(filterText) != -1 ||
        item.Name.toLowerCase().indexOf(filterText) != -1 ||
        item.Type.toLowerCase().indexOf(filterText) != -1 ||
        filterText == "")
        {
            return true;
        }
        //-


        /* Option 3 */
        /* 2 + concatenate string to minimise indexOf() */
        //+
        if
        (String(item.Level+item.Name+item.Type).toLowerCase().indexOf(filterText) != -1 ||
        filterText == ""){
            return true;
        }
        //-

        // If no matches then hide item //
        return false;
    }

    //Broadcast modelChanged so datagrid updates //
    m_mainListDS.dispatchEvent({type:"modelChanged"})
}

I dynmically generated 600 results and added two date objects to see how long each filter method was taking.

I tested a variety of operations on a P3 800Mhz with 64mb ram and the results are as follows:

Operation	Method 1	Method 2	Method 3
e	110	110	50
a	110	110	50
paste 'easy'	110	110	50
select all - del	50	110	60
a	100	100	50
n	160	170	110
Total	640	710	370

Obviously the third method, concatenating the field values first before performing the indexOf() was the best method to use. The idea of the first method was to try and minimise the time taken to generate a return message when a result was found. This is why it was the fastest at returning the complete DataSet when the Text Input was cleared.

 

Comments