Html5qpp开发学习笔记.docx

Html5 app开发学习笔记一、序言过去的几年里，我一直在研究HTML5移动Apps。整体的印象就是HTML5为开发者提供了一个跨平台的移动apps开发方案，并且该方案具有很好的扩展性和灵活性。我始终认为web技术将成为移动设备上的开发平台，只是目前该技术可能尚未成熟。我很担心有些人还没有弄清楚HTML5到底是什么，就盲目地开始在自己的移动设备开发中使用HTML5了。在过去的一年中，我在努力地改变大家对HTML5的理解，让他们认识到HTML5是一个移动开发平台。大家都知道HTML5能够做哪些事，但是你又是否知道HTML5是如何做这些事的呢？从我使用web技术开发的第一个移动产品到今天，已经有超过十年的时间了。我见证了移动web发展的整个历史，我曾写过一本关于怎样设计和开发移动web apps的畅销书。到底应该怎样使用和看待HTML5呢？通过采访许多相关的公司，我们找到了关于这个问题的答案。可以将这篇文章看做是了解开发跨平台的移动web apps的引导手册。为什么开发一个HTML5移动Apps是一件困难的事情呢？因为通常，开发者需要实现图表中展示的所有部分。即使你不亲自开发它，你也需要借用其他人的设计，并且你还是得对各个部分进行测试和调试。二、设置服务器客户端发送请求在移动web设备上查看某个内容。这个请求通常是一个发送到某台服务器上的HTTP请求。通常，会自动生成用户需要的内容。为了将内容加入到app中通常需要至少两件事情：数据以及怎样使数据变得有意义，或者是我们的HTML5 app。你是否有一个设备检测方案？由于各种设备存在很大的差异性，所有在服务器端最好能够有一个设备检测机制。实现这种检测机制的方法是很多的，甚至可以提供设备更多更加详细的信息以及容量性能方面的信息。程序员可以对所有的设备统一进行处理，这对于简单的应用是可行的。但是对于大多数长久运行的项目来说，这显然是不够的。针对移动设备处理方法，Scott Gledhill?给出了一些简短的介绍文档——Mobile BitsScott on Mobile DevicesScott on Device Fragmentation?你打算如何处理离线数据15% 的移动apps启 动时设备是脱机。所以你的应用程序需要处理脱机的情况。最初的程序设计时页面的访问当然是需要通过Internet的，但是如果连接端掉了，你的程序应该 也能够继续正常运行。当设备连接到网络时，应用程序如何处理用户的数据？为了处理脱机访问的情况，是否可以考虑将所有的数据打包返回？本文稍后会介绍cache manifest，但是不要指望cache manifest能够解决所有的问题。你还需要调用RESTful?API，用来处理数据同步刷回的问题。三、HTML5 App现在已经有了处理数据和设备的方法了，接下来就可以开发一个HTML5 App了——这是其中最简单的一部分。HTML5是由HTML演化来的，如果你已经知道HTML了，那么你能很快地了解怎样使用HTML5。为了迅速了解HTML5中引入的新功能，你可以查看下面两个链接。Mark Pilgrim’s Dive in HTML5Scott Gledhill’s?Mobile BitsHTML5加入了许多好用的新功能，但是它并没有从根本上改变大家的编程方式。你可以在HTML5中使用Javascript和CSS3，但是它仍然还是使用标签定义内容的方式编写应用。cache manifestHTML5最好的功能之一就是提供了cache manifest，可以将它看作是app的一个缓存。cache manifest实际上是一个文本文件，上面罗列了需要在本地缓存的内容。使用该功能，可以方便地将常用的Javascript、CSS和图片文件缓存在 设备的内存中。这样，即使设备处于脱机状态，用户还是能够正常访问应用的界面。除此以外，使用cache manifest功能还能减少网络连接的请求次数。对于动态数据的缓存处理则需要使用Javascript刷回缓存的数据，而不是cache manifest。需要指出的是，大多数的apps都需要处理脱机访问的问题。Mark’s chapter on offline applications介绍了更多缓存的相关问题你的降级策略是怎样的？最后一点，需要指出的是各种设备存在着或多或少的差异。即使你只打算支持某一种平台，在这种平台上的各个设备也不是完全相同的。当应用无法按照预想 的方式呈现时，能够提供一组隔离代码是最好的撤回策略。换句话说，就是要使代码尽量简洁且不依赖某些特殊的边缘技术——我们称之为优雅的降级。HTML5开发的代码最好严格地遵循语法规定。首先不要在代码中加入任何的CSS或Javascript，通常这种形式最简单的代码具有最好的通用