Question

我正在使用phonegap为android开发一个Android应用程序。由于jQuery mobile为我们提供了丰富的ui组件。所以我选择使用jQuery mobile。

现在的问题是，当我使用jQuery mobile时，它会降低应用程序性能。意味着加载时间已经增加。所以我只想知道如何正确使用它们，这样应用程序性能就不会受到影响。

目前我正在这样插入。

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet"
    href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script
    src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script>

Answer 1

我建议你将jquery包装在你的资产/ www中，就像杰森所说的那样。然后在androidmanifest.xml中添加：android:hardwareAccelerated="true" Inside标签，如下所示：

<application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:hardwareAccelerated="true"
        android:theme="@style/AppTheme" >
        <activity

这将使用GPU呈现您的网页视图。

不要忘记定位最新或至少ICS版本进行编译。可以在首次创建应用程序或编辑androidmanifest.xml时完成：

 <uses-sdk
        android:minSdkVersion="9"
        android:targetSdkVersion="16" />

这种方法证明适用于我的应用程序。：d

Answer 2

好吧，我会将jquery库与phoengap应用程序打包在一起。这样，每次从code.jquery.com启动应用程序时，您都不会获取资源。这将使您的HTML看起来像这样：

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/scripts/jquery.mobile-1.2.0.min.css" />
<script src="/scripts/jquery-1.8.2.min.js"></script>
<script src="/scripts/jquery.mobile-1.2.0.min.js"></script>

Answer 3

你可以使用jQuery mobile template的骨干网，我将其集成并在phonegap上进行测试，它就像魅力一样

Answer 4

除了使用应用程序打包jquery库之外，您还可以禁用所有动画以提高响应速度，尤其是在Android设备上（动画似乎在iOS设备上运行合理）。

// Suppress all page transitions
$(document).bind('pageinit', function (){
    $.mobile.defaultPageTransition = 'none';
});

使用带有phonegap的jQuery Mobile

4 个答案: