Android上的Durandal过渡缓慢

Question

我将使用 Phonegap + Durandal 开发一个混合应用程序。 到目前为止，我正在开发一个经典的 Web 应用程序，并计划在我对应用程序的功能集感到满意后立即切换到混合应用程序。

到目前为止，我意识到在使用我的 Nexus 4 或 Nexus 7 平板电脑时，Durandal 在从一个视图切换到另一个视图时执行的转换非常草率且不流畅。

有人知道如何加快速度吗？最后的选择是完全关闭转换，但这将是非常可悲的 =(

更新： 好的，发现例如entry.js 似乎使用 Javascript 动画而不是 CSS3 动画。猜猜这是从哪里开始修复

Answer 1

我确实使用了这个库： css3 transit 比默认快得多

并更改 entry.js（可能你需要适应你，但这对我有用）

define(['../system'], function(system) {
var fadeOutDuration = 100;

var entrance = function(parent, newChild, settings) {
    return system.defer(function(dfd) {
        function endTransition() {
            dfd.resolve();
        }

        function scrollIfNeeded() {
            if (!settings.keepScrollPosition) {
                $(document).scrollTop(0);
            }
        }

        if (!newChild) {
            scrollIfNeeded();

            if (settings.activeView) {
                $(settings.activeView).transition({
                      opacity: 1,
                      scale: 0.3,
                      duration: duration,
                      easing: 'in',
                      complete: function(){
                        $(settings.activeView).css('display' ,'none');
                            if (!settings.cacheViews) {
                                ko.virtualElements.emptyNode(parent);
                            }
                            endTransition();
                        }
                    });


            } else {
                if (!settings.cacheViews) {
                    ko.virtualElements.emptyNode(parent);
                }
                endTransition();
            }
        } else {
            var $previousView = $(settings.activeView);
            var duration = settings.duration || 500;

            function startTransition() {
                scrollIfNeeded();

                if (settings.cacheViews) {
                    if (settings.composingNewView) {
                        ko.virtualElements.prepend(parent, newChild);
                    }
                } else {
                    ko.virtualElements.emptyNode(parent);
                    ko.virtualElements.prepend(parent, newChild);
                }

                var startValues = {
                    //marginLeft: '90%',
                    //marginRight: '-20px',
                    opacity: 0,
                    scale: 0.3,
                    display: 'block'
                };

                var endValues = {
                    //marginRight: 0,
                    //marginLeft: 0,
                    opacity: 1,
                    scale: 1
                };
                $(newChild).page();
                $(newChild).trigger('create');
                $(newChild).css(startValues);
                $(newChild).transition(
                    {
                      marginRight: 0,
                      marginLeft: 0,
                      opacity: 1,
                      scale: 1,
                      duration: duration,
                      easing: 'in',
                      complete: endTransition
                    });
                    //startValues,500, 'ease');
                //$(newChild).transition(endValues, duration, 'swing', endTransition);
                //$(newChild).transition({ opacity: 0.1, scale: 0.3 }, 500, 'in', function() {..});
                //endTransition();
            }

            if ($previousView.length) {
                $previousView.transition({
                      opacity: 0,
                      scale: 0.3,
                      duration: 500,
                      easing: 'in',
                      complete: function(){
                          $previousView.css('display' ,'none');
                          startTransition();
                      }
                });

                //$('.news').css('display','none');

                //$previousView.fadeOut(fadeOutDuration, startTransition);
            } else {
                startTransition();
            }
        }
    }).promise();
};

return entrance;

});

对不起，我的英语不好。