注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

秒大刀 博客

好好学习 天天向上

 
 
 

日志

 
 
 
 

读《HTML5高级程序设计》  

2012-01-20 14:06:57|  分类: 读书 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
读《HTML5高级程序设计》 - 秒大刀 - 秒大刀 博客


第1章 HTML5概述
  1. HTML5规范已经以“工作草案”的形式发布了——还不是最终版。2012年,目标是发布“候选推荐版”。2022年,目标是发布“计划推荐版”
  2. 尽管HTML5标准的一些特性非常具有革命性,但是HTML5旨在进化而非革命。毕竟没有从头再来的必要
  3. HTML5规范是基于用户优先准则编写的,其宗旨是“用户即上帝”,这意味着在遇到无法解决的冲突时,规范会把用户放到第一位,其次是页面作者,再次是实现者(或浏览器),接着是规范制定者,最后才考虑理论的纯粹性
  4. JavaScriptModernizr提供了非常先进的HTML5和CSS3检测功能,是检测浏览器是否支持某些特性的最佳工具
  5. 不能用HTML5实现的应用已经变得越来越少了
  6. HTML5推荐表现和内容分离,在HTML5的实际编程中,开发人员必须使用CSS来定义样式
  7. HTML5引入了新的Selectors API querySelectorquerySelectorAll,可以用更精确的方式来指定希望获取的元素
  8. console.log API已经成为JavaScript开发人员记录日志的事实标准。相比alert,console.log不会阻塞脚本的执行
  9. JSON必将大量应用于HTML5应用中
  10. 过去的JavaScript纯粹是被解释执行,而最新的引擎则直接将脚本编译成原生机器代码。得益于浏览器厂商间的良性竞争,JavaScript的执行性能越来越接近于本地桌面应用程序

第2章 Canvas API
  1. Canvas本质上是一个位图画布,其上绘制的图形是不可缩放的。用Canvas绘制出来的对象不属于页面DOM结构或者任何命名空间。SVG图像可以在不同的分辨率下流畅的缩放,并且支持点击检测。但Canvas因不需要将所绘制图像中的每个图元当做对象存储,执行性能非常好;在其他编程语言现有的优秀2D绘图API的基础上实现Canvas API相对来说更简单。毕竟,二鸟在林不如一鸟在手。
  2. 只有当路径应用strokefill方法时,结果才会显示出来。只有在显示图像、显示文本或者绘制、填充和清除矩形框的时候,canvas才会马上更新
  3. 不在代码中调用变换函数并不意味着可以提升canvas的性能。canvas在执行的时候,变换会被呈现引擎隐式调用
  4. 一般绘制都应从原点开始,应用变换(translaterotatescale)将其调整到希望的效果。所有的变换操作都是针对远点进行的。
  5. canvas的clearRect功能是创建动画和游戏的核心功能。通过反复绘制和清除canvas片段,就可能实现动画效果。如果希望创建运行起来比较流畅的动画,就需要使用clip功能,有可能还需要二次缓存canvas,以便最小化由于频繁的清除动作而导致的画面闪烁
  6. 图片在呈现之前应确保已经加载完毕
  7. 如果canvas中的图片并非来自包含它的页面所在的域,页面中的脚本将不能取得其中的数据

第3章 音频和视频
  1. JavaScript中可以通过"!!"运算符将结果转换成布尔值
  2. 视频文件中的容器和编解码器是相对独立的
  3. 大部分用户对音频、视频加载完成后自动播放的方式会比较反感,慎用

第4章 Geolocation API
  1. HTML5 Geolocation API返回的经纬度坐标为十进制格式
  2. HTML5 Geolocation API不指定设备使用哪种底层技术来定位应用程序的用户。相反,它只是用于检索位置信息的API,而且通过该API检索到的数据只具有某种程度的准确性。它并不能保证设备返回的实际位置是精确的。
  3. 设备可以使用以下位置数据源:
    1. IP地址地理定位数据
      • 自动查找用户的IP地址,然后检索其注册的物理地址
      • 在任何地方都可用,但不精确(经常出错,一般精确到城市级)
      • 在服务器端处理,运算代价大
      • 许多网站会根据IP地址得到的位置信息来做广告
    2. GPS地理定位数据
      • 只要可以看到天空的地方,GPS就可以提供非常精确的定位结果。
      • 定位很精确,但定位时间长,用户耗电量大,室内效果不好,并需要额外的GPS硬件设备支持
    3. Wi-Fi地理定位数据
      • Wi-Fi定位是通过用户当前位置到已知的多个 Wi-Fi接入点的三角距离计算出来的
      • 精确,可在室内使用,可以简单、快捷的定位,但在乡村等接入点较少的地区效果不好
    4. 手机地理定位数据
      • 通过用户到多个基站的三角距离计算
      • 相当准确,可在室内使用,可以简单、快捷定位,但在基站较少的偏远地区效果不好
    5. 用户自定义的地理定位数据
      • 用户自行输入可能比自动检测更快
      • 可能很不准确
  4. HTML5 Geolocation除非得到用户明确许可,否则不可获取位置信息
  5. 半正矢公式(Haversine formula)可根据经纬度来计算地球上两点间的距离

第5章 Communication API
  1. 源是网络上简历信任关系的地址的子集。源由规则(scheme)、主机(host)、端口(port)组成。
  2. XMLHttpRequest仅限于同源通信
  3. 若通过服务器端对不同远进行整合,则所有内容都要穿过一个服务器端的基础层,因而可能会形成瓶颈

第6章 WebSockets API
  1. 目前实时Web应用的实现方式,大部分是围绕轮询和其他服务器端推送技术展开的。
    1. Comet技术可以让服务器端主动以异步方式向客户端推送数据,它会使针对传输消息到客户端的相应延迟完成
    2. 使用轮询时,浏览器会定期发送HTTP请求,并随时接收响应。不可避免的会产生一些不必要的请求,在地消息率的情况下会有很多无用的连接不断的打开和关闭。
    3. 使用长轮询时,浏览器向服务器发送一个请求,服务器会在一段时间内将其保持在打开状态。如果服务器在此期间收到一个通知,就会向客户端发送一个包含消息的响应。如果时间已到却还没收到通知,服务器会发送一个响应消息来终止打开的请求。当信息量很大时,与传统轮询方式相比,长轮询方式并无实质上的性能改善。
    4. 使用流解决方案时,浏览器会发送一个完整的HTTP请求,但服务器会发送并保持一个处于打开状态的响应,该响应持续更新并无限期(或是一段时间内)处于打开状态。每当有消息可发送时该响应就会被更新,但服务器永远不会发出响应完成的信号,这样连接就会一直保持在打开状态以便后续消息的发送。但由于流仍是封装在HTTP中,其间的防火墙和代理服务器可能会对响应消息进行缓冲,造成消息传递的时延。当检测到缓冲代理服务器时,许多流解决方案就回退到长轮询方式。此外,可利用TLS(SSL)连接来保护响应不被缓冲,但在这种情况下,每个连接的创建和消除会消耗更多的服务器资源。
  2. HTTP技术并不是为了实现实时全双工通信设计的
  3. WebSocket通信是在客户端和服务器端初次握手时,将HTTP协议升级到了WebSocket协议。因其协议衍生与HTTP协议,很多服务器都可以使用同一端口响应WebSocket和HTTP请求。
  4. 一旦WebSocket 连接建立,则可能同一时间、任何方向,都能全双工发送基于文本的消息。每个消息以0x00字节开头,以0xFF结尾,中间数据采用UTF-8编码
  5. WebSocket URL中的ws://和wss://前缀分别表示WebSocket连接和安全的WebSocket连接
  6. WebSocket编程遵循异步编程模型,打开socket后,只需要等待事件发生

第7章 Forms API
  1. 旧浏览器中新的表单控件会平滑降级。当浏览器不支持新的输入型控件时,会把它们呈现为简单的文本输入框
  2. autocomplete特性用来保护敏感用户数据,以避免本地浏览器对其进行不安全的存储
  3. 表单验证就是在表单提交服务器前对其进行一系列的检查并通知用户纠正错误。
    表单验证是一种优化,仅通过表单验证机制不足以保证交给服务器的表单数据是正确和有效的。设计表单验证是为了让Web应用更快的抛出错误。
    最好利用浏览器内置的处理机制来告知用户网页内包含无效的表单控件值。
    不过,浏览器的表单检查还不足以处理所有的错误。
    重要数据的验证不能仅依靠客户端验证一种方式,只要数据存储在客户端,它就可以被篡改
    HTML5的表单验证可让用户快速获得重要反馈,但正确性方面绝对不应依赖于它!

第8章 WebWorkers API
  1. Web Workers不能直接访问Web页面的DOM API,不会导致浏览器UI停止响应
  2. Web Workers初始化时会接受一个JavaScript文件的URL地址,其中包含了供Worker执行的代码。这段代码会设置时间监听器,并与生成Worker的容器进行通信
  3. 可以在Worker中采用importScripts的方式引入其他JavaScript文件
  4. Web Wroker不能自行终止,但能够被启用它们的页面所终止worker.terminate()

第9章 Web Storage API
  1. Web Storage可代替cookie,用于在跨窗口、跨标签页、跨浏览器重启的情况下,保存本地数据
  2. 用户每次访问某个域时,cookie数据都会被来回传送,这些数据会消耗网络带宽
  3. cookie的大小受限,一般只能设置大约4KB的数据
  4. cookie因能被同源网页共享,会出现数据泄露
  5. 只要网页是同源的(包括规则、主机和端口),基于相同的键,我们都能够在其他网页中获得设置在Web Storage中的数据
  6. sessionStorage数据会保存到存储它的窗口或标签页关闭时,数据只在构建它们的窗口或者标签页内可见
  7. localStorage数据的生命期比窗口或浏览器的生命期长,数据可被同源的每个窗口或者标签页共享
  8. 因JavaScript对象是关联数组,可以把对象当做数组来访问

第10章 构建离线Web应用
  1. HTML5应用并不需要始终保持网络连接,开发人员可以更加灵活的控制缓存资源的加载
  2. HTML5的缓存控制机制综合了Web应用和桌面应用两者的优势:基于Web技术构建的Web应用程序,可在浏览器中运行并在线更新,也可在脱机情况下使用
  3. HTML5的离线应用缓存使得在无网络连接状态下运行应用程序成为可能
  4. window.navigator.onLine可以用来判断浏览器是否在线
  5. 离线应用包含一个manifest文件,此文件中列出了浏览器为离线应用缓存的所有资源。manifest的MIME类型是text/cache-manifest
  6. window.applicationCache.update会请求浏览器更新缓存。包括检查新版本的manifest文件并下载必要的新资源

第11章 HTML5未来展望
  1. HTML将以增量的形式发展而非一撅而就,其中特定的功能及其对应规范会单独发展。大家就这些功能达成共识之后,浏览器才会采纳并加以实现
  2. WebGL的着色器用GLSL
  3. Web访问方式越来越多的从台式机和笔记本电脑转换到了手机和平板电脑中,因此HTML5的人机交互处理方式也在逐渐发生变化
  4. 要想开发更快的多人游戏和协作软件,P2P技术是不二之选

  评论这张
 
阅读(1303)| 评论(1)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017