hujs 总结淘宝观光团

hujs

主题

• javascript

• nodejs

• cloud service

• win8

• javascript

• knockout.js

knockout.js

knockout.js

knockout.js

knockout.js• MVVM

• view model

• data and behavior

• view

• DOM binding

• DOM as template

• just change view model to sync with

view

knockout.js

• my option

• DOM oriented

• hard to work with javascript newed

component (KISSY)

• behavior and view are not separated

• ECMAScript 5

Object

• Object.create

• Object.defineProperty

• Object.getPrototype

• Object.keys

• Object.getOwnPropertyDescriptor

• Object.getOwnPropertyName

• Object.seal/preventExtension/freeze ...

Array• every

• some

• map

• filter

• forEach

• reduce

• indexOf ...

JSON

• stringify(value,[ [replacer],space])

• parser(text,[reviver])

• subset of javascript

• double quote

• not support \x \t \n

‘use strict’;

• 禁止不声明的变量

• 禁止 with

• 全局 eval

• arguments 不同步参数

• 禁止 caller callee

• 禁止对象重复属性名

• wind.js 调试

wind.js

$wait(readFile);alert('read complete');

readFile(function(){alert(‘read complete’);

});

compile

souce map

• Generated by closure compiler. Intro

• native support in chrome

• 调试压缩/翻译代码

• used at KISSY XTemplate

//@ sourceMappingURL=/path/to/file.js.maporX-SourceMap: /path/to/file.js.map

KISSY XTemplate

var tpl = 'this is {{title}}!';

var data = {title: 'o'

};

var render = new XTemplate(tpl, {name: 'tpl-variable'

}).render(data);

• Modularization( Seajs, KISSY Loader )

• Modularization

• 可维护性

• 性能

• 组件（模块）共享

• 调试

• Promise/A (Q, KISSY)

Promise• cleaner method signature

• nested call changed to chained call

io.get("url1",function(){io.get('url2',function(){

io.get('url3',function(){});

});})

io.get("url1").then(function(){

return io.get("url2")

}).then(function(){

return io.get("url3");

}).then(function(data3){

});

Promise

• easy combination

• easy parallel

S.Promise.all( io.get('url1'),io.get('url2'),function( data1, data2 ){

});

Promise

• exception-bullet

io.get('url').then(function(){throw "2";

}).fail(function(w){

alert(w);

});

Promise

• error bubble

io.get("url1").then(function(){

return io.get("url2")

}).then(function(){

return io.get("url3");

}).then(function(data3){

},function(err){

alert(error);

});

Promise

• error recovery

io.get("url1").then(function () {

return io.get("url2");

}, function (e) {

// error recoveryS.log(e);return io.get("url2");

}).then(function (data2) {

});

• nodejs

• nodejs proxy for mysql

优势

• 对比 c/c++

• 简化实现非阻塞异步功能

• 性能差别不大

• 编程复杂度低

常用模块

• async

• 方便异步操作

• log4js

• 日志

• node-webkit-agent

• 使用 chrome dev tools 监控服务器端

• nodejs for webim（长连接）

优势

• 快速原型

• 学习成本低

• 出众的性能

• 团队入门快

多进程架构

nodejs 优化

• 子进程往父进程发送心跳保证稳定

• c++ 扩展提高性能

• cpu 绑定进程

• nodejs for backend game engine

game vs web

• area based vs load balance

• state vs stateless

• broadcast (area) vs request / response

• tick vs request

• nodejs @ taobao

调优

• console.time / timeEnd

• benchmark.js 性能测量

• top / iotop @linux

• node-webkit-agent

• v8profile

• nodejs gc log -> jvm gc log

• cloud service

cloud

• appfog

• azure

• npm install azure

• git commit

• git push azure master

• win8

thanks