0

我有一个 25,000 多行的 slickgrid。我已经设置了列过滤（参见示例），它工作正常并且非常快。

我现在已经添加了CheckboxSelectColumn插件（参见示例），虽然这有效，但它削弱了过滤的速度。一切仍然有效，只是速度慢了很多。

我尝试通过提供RefreshHints（参见示例）来优化过滤，但没有任何乐趣。

它只是过滤加上复选框加上大行数的组合，还是我做错了什么？

以下是相关的代码（CoffeeScript）。

设置列过滤器

setupColumnFilters:()->
    $(grid.getHeaderRow()).delegate(':input', 'change keyup', (e) ->
        columnId = $(this).data('columnId')
        if columnId?
            newVal = $.trim($(this).val())
            columnFilters[columnId] = newVal

            # Trying to optimise using RefreshHints
            newLen = newVal?.length
            oldlen = columnFilters[columnId]?.length ? 0
            isNarrowing = newLen > oldlen
            isExpanding = newLen < oldlen
            renderedRange = grid.getRenderedRange()
            dataView.setRefreshHints({
                ignoreDiffsBefore: renderedRange.top,
                ignoreDiffsAfter: renderedRange.bottom + 1,
                isFilterNarrowing: isNarrowing,
                isFilterExpanding: isExpanding
            })
            dataView.refresh()
    )

    grid.onHeaderRowCellRendered.subscribe((e, args) ->
        node = $(args.node)
        node.empty()
        id = args.column.id
        if id == '_checkbox_selector'
            node.hide()
            return
        placeholder = 'filter by ' + id
        html = '<input type="text" placeholder="' + placeholder + '">'
        $(html)
            .data('columnId', id)
            .val(columnFilters[id])
            .appendTo(node)
            .focus(()->$(this).attr('placeholder', ''))
            .blur(()-> $(this).attr('placeholder', placeholder) if $(this).val()?)
    )

设置 CheckboxSelect 插件

setupCheckboxSelect:() ->
    checkboxPlugin = new Slick.CheckboxSelectColumn({ cssClass: "slick-cell-checkboxsel" });
    columns.unshift(checkboxPlugin.getColumnDefinition());
    grid.setColumns(columns);
    grid.registerPlugin(checkboxPlugin);

过滤器功能

filter: (item) =>
    grid.setSelectedRows([])
    columns = grid.getColumns()
    for columnId, filter of columnFilters
        if filter?  
            column = columns[grid.getColumnIndex(columnId)]
            field = item[column.field]
            return false unless (field? && field.toLowerCase().indexOf(filter.toLowerCase()) > -1) 
    return true
4

1 回答 1

1

哇，你为什么grid.setSelectedRows([])在你的过滤器中调用？！？
每当您刷新数据时，它都会被调用 25'000 次。

除了完全没有意义之外，当您使用复选框选择列时，它确实会减慢速度，因为它需要同步状态（基于选择）。

于 2013-03-07T18:49:57.883 回答