css - Kendo js 在客户端下载时花费太多时间

Question

我在我的元素中使用 kendo ui 调度程序，但是在客户端下载 kendo js 和 css 需要太多时间，因此我们的网站速度有些慢。为了克服这个问题，我们正尝试根据请求下载 kendo js 和 css，这意味着仅在加载调度程序日历的页面上。虽然集成相同，但我们无法添加依赖项“kendo.directive”。请建议如何添加该依赖项或减少延迟的替代方法。

请找到相同的代码。

myApp.requires.push('kendo.directives');

myApp.controller('CalenderController',['$scope', '$http', 'StatsService', function ($scope, $http, StatsService) {
    var self=this;

    $scope.schedulerOptions = {
        date: new Date(),
        startTime: new Date(),
        showWorkHours: true,
        height: 600,
        views: [
            "day",
            {type: "week", selected: true},

        ],
        editable: {
            destroy: false,
            create: false,
            template: $("#editor").html()
        },
        timezone: "GMT",
        dataSource: {
            batch: true,
            transport: {
                read: function (options) {
                    url = '/consultants/applications/interviews';
                    $http.get(url).success(function (data, status, headers, config) {
                        options.success(data.result);
                    }).error(function (data, status, headers, config) {
                        options.error(data);
                    });
                },
                parameterMap: function (options, operation) {
                    if (operation !== "read" && options.models) {
                        return {models: kendo.stringify(options.models)};
                    }
                }
            },
            schema: {
                model: {
                    id: "interviewId",
                    fields: {
                        taskId: {from: "id", type: "number", editable: false},
                        candidateName: {from: "candidateName" , editable: false},
                        title: {from: "title", defaultValue: "No title" , editable: false},
                        companyName: {from: "companyName" , editable: false},
                        start: {type: "date", from: "interviewTiming", editable: false},
                        end: {type: "date", from: "interviewEndTiming" , editable: false},
                        candidateEmail: {from: "candidateEmail" , editable: false},
                        candidateMobile: {from: "candidateMobile" , editable: false}
                    }
                }
            }
        }
    };
}]);

Answer 1

使用自定义组合脚本，比kendo.all.min.js...

http://docs.telerik.com/kendo-ui/intro/installation/what-you-need#build-scripts

...或使用单独的脚本文件:

http://docs.telerik.com/kendo-ui/intro/installation/what-you-need#individual-widget-scripts

在这两种情况下，加载的脚本文件的大小都会减小。

不幸的是，CSS 代码不存在相同的选项。