如何加快jquery-ui旋转器的绑定处理程序

How to speed up bindingHandler for jquery-ui Spinner

本文关键字:绑定 处理 程序 何加快 jquery-ui 旋转      更新时间:2023-09-26

我得到了一个销毁旋转器的绑定:

ko.bindingHandlers.spinner = {
    init: function (element, valueAccessor, allBindingsAccessor) {
        //initialize datepicker with some optional options
        var options = allBindingsAccessor().spinnerOptions || {};

        $(element).spinner(options);
        //handle the field changing
        ko.utils.registerEventHandler(element, "spinchange", function () {
            var observable = valueAccessor();
            observable($(element).spinner("value"));
        });
        //handle disposal (if KO removes by the template binding)
        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
            $(element).spinner("destroy");
        });
    },
    update: function (element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor()),
            current = $(element).spinner("value");
        if (value !== current) {
            $(element).spinner("value", value);
        }
    }
};

它工作没有问题,但当我添加很多这些到一个页面,我得到性能问题。在我的页面上,我有44个旋转器,这导致视图2秒加载。将旋转器替换为带有"值"绑定的旋转器可以修复性能问题,但看起来不那么好。有什么建议如何加快bindingHandler,使其更有效?

您的自定义绑定中没有任何东西会显着减慢它的速度。您的绑定是将jQuery UI插件与Knockout结合的最简单形式的完美示例。我有很多这样的绑定,在一个页面上添加了数百个,没有任何性能问题。

那么问题是什么呢?我们不能告诉你,因为相关代码不在那里。这个特性中最慢的部分可能是旋转器本身,而不是您创建的绑定。为了加快速度,你需要优化spinner插件。我不知道这是否可能,因为在你的帖子中没有提到这个插件。

另一个完全不同的注意事项:在一个页面上显示44个旋转器可能对用户体验没有帮助。也许你应该放慢旋转器的使用速度:p