jQuery Mobile的应用奇怪的行为 [英] Jquery Mobile Application Strange Behaviour

查看:210
本文介绍了jQuery Mobile的应用奇怪的行为的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已创建了一个应用程序,它包含有关按钮我的应用程序重定向到一些人认为它包含JQM形式,JQM日历,文本字段,按钮和数据库等一几个按钮首页点击....

I have created one application which contains several buttons to home page clicking on one of that button my application redirects to some view which contains JQM form, with JQM calendar, text field, buttons and database etc....

我的查询是,当我测试我的Andr​​oid设备的应用程序上的时间的应用程序的工作原理有点慢,即使我没有使用任何图像,或者可以包含更多空间的任何数据。这是我的第一个查询和第二个是,当我测试我的应用程序在那个时候Android平板电脑构成页面出现了一会,突然将其重定向回到主页上自动完成,而同样的功能运作良好的android手机。

My query is that when I test my application in android device on that time application works a little bit slow, even if I have not used any images,or any data which can contain more space. That's my first query and second one is that when I tested my application to android tablet on that time that form page is appearing for a while and suddenly it redirects back to home page automatically, while this same feature working well for android phone.

为什么这个奇怪的问题?

Why this strange issue?

如果任何一个可以指导我认为这将是我的荣幸。

If any one can guide me on it that it will be my pleasure

推荐答案

这是很难做出有关性能下降和重定向问题的假设。下面你可以找到一些方面,我认为影响移动应用程序,包括HTML5,CSS3,JavaScript的,并应考虑对分析,设计和开发阶段的表现。

It's difficult to make assumptions regarding the slow performance and the redirection issue. Below you can find some aspects which in my opinion affect the performance of a mobile application which consists of HTML5, CSS3, JavaScript and should be taken into consideration on the analysis, the design and the development phase.

基于规模实现方法

在开发小型移动应用程序中使用内部AJAX页面链接一个HTML页面的使用建议。对于更大的移动应用,建议使用具有内部的AJAX联不同的HTML页面的方法。尝试创建可重复使用的页面模板。

When developing small mobile applications the usage of a single HTML page using internal-AJAX page linking is recommended. For bigger mobile applications, a method of using different HTML pages with internal-AJAX linking is recommended. Try to create reusable page templates.

页转换

由于在 JQM 1.1.1文档表示,在默认情况下,除了褪色所有过渡需要3D变换的支持。缺乏3D支持的设备将落在规定的过渡回渐变过渡,而不管。 JQM这是否该采取积极的高级过渡排除类似的Andr​​oid 2.X效果不佳的平台,并确保他们仍然有一个流畅的体验。请注意,有平台,如Android 3.0,在技术上支持3D转换,但仍然有动画表现不佳所以这并不能保证所有的浏览器将是100%无闪烁。决定你会考虑上述使用后的过渡类型。

As stated in the jQM 1.1.1 Docs, by default, all transitions except fade require 3D transform support. Devices that lack 3D support will fall back to a fade transition, regardless of the transition specified. jQM does this this to proactively exclude poorly-performing platforms like Android 2.x from advanced transitions and ensure they still have a smooth experience. Note that there are platforms such as Android 3.0 that technically support 3D transforms, but still have poor animation performance so this won't guarantee that every browser will be 100% flicker-free. Decide the transition type that you will use after considering the above.

缩小JS和CSS文件

每个网页应尽可能轻。该缩小的目标是preserve的code,同时降低其整体字节的足迹业务素质。有很多工具可用,如 YUI的COM pressor ​​,Web上的< A HREF =HTTP://$c$c.google.com/p/minify/>缩小等等。此外,还有像 JLint 的工具,用来检查JavaScript源$ C ​​$ C是否符合编码规则。 JLint 是一个code质量的工具,它检查在JavaScript中code问题。该报告的问题不一定是语法错误,但可能是结构性问题。需要注意的是JLint并不能证明你的code是正确的。认为这是一个帮助工具。也有用于执行CSS的优化工具。优化帮助您获得更小的CSS文件大小和更好的书面code。你可以找到很多提供WEB的CSS优化,如 CleanCSS 和的 CSSTidy

Each page should be as lightweight as possible. The minification’s goal is to preserve the operational qualities of the code while reducing its overall byte footprint. There are a lot of tools available on the WEB like the YUI Compressor, the Minify and many more. Furthermore there are tools like the JLint which is used to check whether JavaScript source code complies with coding rules. JLint is a code quality tool which checks for problems in the JavaScript code. The reported problems are not necessarily syntax errors but may be structural problems. Note that JLint does not prove that your code is correct. Consider it as a helping tool. Also there are tools for performing CSS optimization. The optimization helps you to get smaller CSS file sizes and better written code. You can find a lot of CSS optimizers available on the WEB such as CleanCSS and CSSTidy.

组件限制

的HTML页面建议限于25KB,以获得最佳的缓存优点为广大的移动网络浏览器。该高速缓存限制取决于操作系统的版本。例如Android 2.1系统拥有约2MB的空间缓存限制。

The HTML pages is recommended to be limited to 25kb in order to gain the optimal caching advantage for the majority of the mobile web browsers. The caching limit varies depending on the OS version. For example Android 2.1 has a caching limit of approximately 2Mb.

HTML5和放大器; CSS3

尝试创建易于阅读,扩展和可重复使用的code。采取使用HTML5和CSS3的充分利用是非常重要的。 HTML5的DOCTYPE声明(&LT;!DOCTYPE HTML&GT; )应该在你的HTML5文档中的HTML标记之前的第一件事。它是一个指令到网络浏览器是什么版本的HTML页面,是写在

Try to create easy to read, to extend and reusable code. It is important to take full advantage of the using of HTML5 and CSS3. The HTML5 DocType declaration (<!DOCTYPE html>) should be the first thing in your HTML5 document before the html tag. It is an instruction to the web browser about what version of HTML the page is written in.

使用 W3C mobileOK检查

Use the W3C mobileOK Checker

是一项免费服务,由W3C的 W3C mobileOK检查,有助于检查Web文档的移动友好的水平,并在特别是断言Web文档是否mobileOK。一个网页是mobileOK通过了所有的测试时。该测试是在mobileOK 基本测试1.0规范。要理解为什么检查Web文档的移动友好真正的问题,它可能是值得强调几点关于所谓的移动世界。相比于常规的台式计算机,移动设备可被认为局限于乍一看:屏幕尺寸较小,更小的处理的权力,更少量的存储器,没有鼠标,等等。相比固定数据连接,移动网络可以是慢,往往有一个较高的延迟。相比于用户坐在自己的电脑前,在旅途中的用户具有有限的时间内,很容易分心。在这些约束条件之上,移动世界是高度分散:许多不同的设备,他们每个人定义了一套独特支持的功能

The W3C mobileOK Checker is a free service by W3C that helps check the level of mobile friendliness of Web documents, and in particular assert whether a Web document is mobileOK. A Web Page is mobileOK when it passes all the tests. The tests are defined in the mobileOK Basic Tests 1.0 specification. To understand why checking a Web document for mobile-friendliness really matters, it is probably worth emphasizing a few points about the so-called mobile world. Compared to a regular desktop computer, a mobile device may be regarded as limited at first glance: smaller screen size, smaller processing powers, smaller amount of memory, no mouse, and so on. Compared to fixed data connections, mobile networks can be slow and often have a higher latency. Compared to a user sitting in front of his computer, the user on the go has limited time and is easily distracted. On top of these constraints, the mobile world is highly fragmented: many different devices, each of them defining a unique set of supported features.

考虑在不同的屏幕尺寸外观

的屏幕密度和视口大小和网页的规模应该针对不同的屏幕尺寸时,应考虑到。视口的元数据可以被用来定义视口尺寸,其中视区是在其中页被吸入容器区域。视口比例限定了施加到网页的缩放级别。靶 - densitydpi viewpoint属性和CSS,JS技术可用于改变目标屏密度为网页。有很多的关于在不同的屏幕尺寸外观的网络文章。

The screens density and the viewport size and web page’s scale should be taken into consideration when targeting different screen sizes. The viewport metadata can be used to define the viewport size where viewport is the container area in which the page is drawn. The viewport scale defines the zoom level which is applied to the web page. The target-densitydpi viewport property and CSS, JS techniques can be used to change the target screen density for the web page. There are plenty of articles on the WEB regarding the appearance on different screen sizes.

确定潜在延迟的流动

借助 PageSpeed​​的Firefox / Chrome扩展可以用来检查网页的速度。当你配置文件与Page Speed​​的网页,它的计算结果页面的一致性,以多种不同的规则。这些规则是你可以在网络发展的任何阶段,应用常规前端的最佳实践。扩展提供了有关如何最好地实施这些规则,并将其纳入发展进程的具体技巧和建议。

The PageSpeed Firefox/Chrome extension can be used to check the pages speed. When you profile a web page with Page Speed, it evaluates the page's conformance to a number of different rules. These rules are general front-end best practices you can apply at any stage of web development. The extension gives specific tips and suggestions on how to best implement the rules and incorporate them into the development process.

我希望这有助于。

这篇关于jQuery Mobile的应用奇怪的行为的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆