学习HTML5游戏开发的几个重要内容

电玩女神 2022-08-09 02:24 169阅读 0赞

整理了一下学习HTML5开发游戏要用到的几个重要内容，方便以后查询：

HTML5:

JavaScript: 单线程（Single-threaded）运行是JavaScript语言的设计目标之一，进而言之是保持JavaScript的简单。但是我必须要说， 尽管JavaScript具有如此语言特质，但它绝不简单！我们所说的“单线程”是指JavaScript只有一个线程控制。是的，这点令人沮 丧，JavaScript引擎一次只能做一件事。

幸好有了HTML5和Web Workers，你可以真正生成一条异步的线程。当主线程处理界面事件时，新的worker可以在后台运行，它甚至可以有力的处理大量的数据。例如，一个worker可以处理大型的数据结构（如JSON），从中提取变量信息然后在界面中显示。

(编码)WebSockets: websocket是应用层协议，底层采用tcp协议，socket是一种实现tcpip协议的工具！也就是说你可以用socket编写支持websocket的应用。

（后台）Web Workers: 当在 HTML 页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成。web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。

（数据库API）：WebSQL API IndexedDB API

(存储数据)Web Storage: Web Storage是HTML5引入的一个非常重要的功能，可以在客户端本地存储数据，类似HTML4的cookie，但可实现功能要比cookie强大的多，cookie大小被限制在4KB，Web Storage官方建议为每个网站5MB。  
Web Storage又分为两种： sessionStorage localStorage  
从字面意思就可以很清楚的看出来，sessionStorage将数据保存在session中，浏览器关闭也就没了；而localStorage则一直将数据保存在客户端本地；  
不管是sessionStorage，还是localStorage，可使用的API都相同.

(定位) 查询浏览器是否支持Geolocation API: navigator.geolocation

(提示用户信息)

（媒体元素）

(绘画API)：Canvas：一个具有高度和宽度属性的可绘画区域，使用JavaScript来绘制动态的复杂图表或图像。

SVG(可扩展矢量图形)：SVG是一个XML文件，用于XML编程的两种模型DOM和SAX也适用于它。因为SVG是被设计用于互联网，所以通过Javascript和DOM访问 它就是最重要的应用模式。通过Javascript和DOM可以动态地修改HTML，同样也可以在浏览器中动态地创建、修改和删除图片。

WebGL：一个实现3d绘画的JavaScript API.

(自定义词汇表) Microdata