如何加速JqueryMobile + Phonegap应用程序

red*_*rom 6 iphone jquery-mobile cordova

我用JqueryMobile和Phoenagap开发了一个iPhone应用程序.我用代码缩小了所有文件,删除了未使用的文件,但app仍然很慢.问题是.如果我点击按钮转换将启动appdrox.1秒后.我想更快地完成页面转换.

我也禁用未使用的部分od设备(相机等),但它仍然很慢.

有人可以帮我解决这个问题吗?

我在iPhone 4g上测试.

Bre*_*olt 27

用于提高性能的指针

缓存jQuery对象

Ex: var header = $('#header');
Run Code Online (Sandbox Code Playgroud)

考虑替代方案:

  • jQuery.each()
  • .节目()
  • .隐藏()
  • .toggle()

改为display:none更快.也许只是使用addClass('hidden')removeClass('hidden')

最小化使用慢速jQuery方法O(n ^ 2)

  • 去掉()
  • HTML()
  • 空()

以下方法也很昂贵:

  • 附加()
  • 前置()
  • 之前()
  • 后()

这些操作方法背后的过程如下:清理输入字符串,将字符串转换为DOM片段并将其注入DOM.

优化选择器:

按性能顺序:

  • id(由于唯一性)
  • 标签
  • name,class(都需要检查每个DOM元素的属性)

获取具体信息,最好选择父母的ID开头:

    $('#test p.description').removeClass('hidden');
    instead of 
    $('.description').removeClass('hidden');
Run Code Online (Sandbox Code Playgroud)

尽可能使用子选择器而不是后代选择器:

    $('div > p').hide(); or $('div').children('p'); 
    instead of
    $('div p').hide(); or $('div').find('p'); 
Run Code Online (Sandbox Code Playgroud)

使用find over context:

    $('div').find('p');
    instead of
    $('div', 'p');
Run Code Online (Sandbox Code Playgroud)

使用.filter()而不是使用标签选择器:

    $('div.name').filter(':input');
    instead of
    $('div.name :input');
Run Code Online (Sandbox Code Playgroud)

记忆化:

var myFunc = function (param) {
    if (!myFunc.cache.hasOwnProperty(param)) {
            var result = {};
            // ... expensive operation ...
            myFunc.cache[param] = result;
    }
    return myFunc.cache[param];
};

// cache storage
myFunc.cache = {};
Run Code Online (Sandbox Code Playgroud)


gee*_*nny 7

虽然Brett Holt的回答提供了很多提高你的应用程序效率的好方法,但我认为你所说的延迟的部分问题与渲染你的应用程序的WebKit引擎有关.在注册单击之前存在~300ms的内置延迟,以允许双击事件.

根据我的研究,共识似乎是与' vclick'事件而不是' click'结合.vclick一旦你点击你的对象就应该开火.

我在我的应用程序中使用了一个名为jquery.touchToClick的库,它自动处理将click事件转换为vclick.这显着加快了我的点击事件.但请记住,它可能不是解决此问题的最有效方法.

我也看过jquery.touchToClick那里的替代库,比如LightningTouch,但我还没试过.