qop / blog Goto Github PK

为了清晰和可维护性，努力组织异步代码。

1. 深入理解JavaScript事件
   JavaScript事件处理器在线程空闲之前不会运行。而是加入到事件队列中，待线程空闲之后再选取执行。
   setTimeout / setInterval是不精确的计时函数，延迟比较粗糙>4ms。
   node中可以使用process.nextTick
   现代浏览器方法：requestAnimationFrame
   异步函数：调用一个函数时，程序只在该函数返回之后才能继续。
   异步递归需谨慎使用，应该使用回调。
   嵌套回调诱惑我们通过添加更多代码来添加更多特性，而不是将这些特性实现为可管理、可重用的代码片段。
2. 分布式事件
   PubSub(Publish/Subscribe)发布/订阅模式
   EventEmitter（事件发生器）对象，nodejs
3. Promise对象和Deferred对象
   jQuery 1.5+，所有ajax函数都会返回Promise对象。——封装性
   ❤『温馨提示50字』的Promise重构。
   http://api.jquery.com/category/deferred-object/
   $.Deferred
   deferred.resolve(), deferred.reject()
   deferred.promise()
   deferred.pipe()
   $.when()
   deferred.done().fail().always()
   deferred.then(doneCallbacks, failCallbacks)
4. Async.js的工作流控制
5. worker对象的多线程技术
6. 异步的脚本加载

打开m.dianping.com，查看源码可以找到如下代码：
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
容易看出，这个meta属性是用来控制屏幕显示和缩放的，但是各属性有什么意义，以及在不同分辨率下的使用又是怎样呢？

1. css pixels & device pixels的区别 css pixels： 浏览器使用的抽象单位， 主要用来在网页上绘制内容。（window.innerWidth/innerHeight） device pixels： 显示屏幕的的最小物理单位，每个dp包含自己的颜色、亮度。（screen.width/height） 举例来说，当设备像素和css像素相同时，缩放屏幕，此时一个css像素在屏幕上占的空间会变小（下文中提到的scale）

手机浏览器是把页面放在一个虚拟的“窗口”（viewport）中，通常这个虚拟的“窗口”（viewport）比屏幕宽，这样就不用把每个网页挤到很小的窗口中（这样会破坏没有针对手机浏览器优化的网页的布局），用户可以通过平移和缩放来看网页的不同部分。移动版的 Safari 浏览器最新引进了 viewport 这个 meta tag，让网页开发者来控制 viewport 的大小和缩放，其他手机浏览器也基本支持。如图所示：

nodejs
NPM
node模块
node事件
node异步