使用NodeJS构建静态资源管理系统

使用Node构建静态资源管理系统(RMS)

yyfrankyy

关于我
}  许阳寅（文河@淘宝，富应用开发团队）
}  https://github.com/yyfrankyy
}  yyfrankyy@gmail.com

Agenda
}  为什么要做RMS
}  设计和实现
}  使用Node开发的一点心得

静态资源管理
}  依赖合并，压缩
}  规范检查，语法检查，安全检查
}  预编译（LESS/Sass，CoffeeScript）
}  Auto Sprite（CSS Gaga）
}  …

为何需要一个平台？
}  如何快速的搭建/升级前端开发环境？
}  工具的使用效果如何评估？
}  怎么持续地跟踪代码变化？
}  工具和代码的变化对业务有何影响？
}  …

对比其他系统
}  B2B的svn proxy
}  Hook实现，拦截提交到版本库的代码
}  百度的前端编译平台
}  统一化执行脚本(build.sh)
}  规范检查，安全检查（包括模版）
}  CSS3，压缩HTML
}  和模版集成，自动时间戳
}  自己实现大部分工具
}  facebook的静态资源管理系统
}  依赖分析，本地化，合并，sprite，压缩
}  伸缩性，处理量量随业务扩展快速膨胀
}  跟业务集成，自我学习，自动优化

淘宝现有的RMS（Based on Java）
}  代码提交之后
}  语法检查（js）
}  安全检查（php/image）
}  字符转换（native2ascii）
}  YUICompressor压缩
}  推送CDN

问题归纳
}  工具不不够多
}  迭代不不够快
}  受工具语言限制
}  构建过程不不灵活
}  构建过程无法灵活组装
}  难于和应用代码集成
}  反馈不不足
}  无法自动化持续改进

RMS 能做什么？

编码依赖差异
压缩编译
转换合并打包

代码库 RMS CDN
发布
状态

在线质量量安全
文档
编辑检查检查

RMS 还能做什么？

访问
Cache POC
热度

代码库 RMS CDN

质量量文件
变化趋势应用引用
代码分析

重新思考
}  RMS 想解决什么问题？
}  通用工具的开发，集成和维护
}  为自动化优化打基础
}  RMS 的目标？
}  让前端开发更更专注业务

new
RMS({by:
nodejs});

Web

Service

预处理安全校验发布 …

为什么用Node？
}  Node社区很多工具模块是前端相关的
}  第三方工具可以通过接口异步调用(jvm)
}  异步工作流很容易实现
}  我们都会写JavaScript

RMS Web

view

express controller

model

webdav svn mysql node-mysql

View
}  NodeJS => Shared Template(Mustache) <= SeaJS
}  给前端的模版
}  GET /template/:template => 返回裸模版
}  app.use(‘jsonp callback’)
}  app.send(obj)
}  GET /data?callback=define => define({foo: bar});
}  后端自动拼接Partial
}  res.send(mustache({{>header}}{{>$partial}}{{>footer}}));

Controller
}  登录验证
}  tbsession(sessionproxy)
}  app.use(login);
}  路由设计
}  app.all(‘/:apptype/:appname/:action/*?’, fn);
}  GET /show/path/to/your/file.js => /path/to/your/file.js => svn
}  GET /log/path/to/your/file.js => show logs
}  POST /confirm => /publish => 转发RMS服务，show status

Model
}  svn的访问
}  Webdav, HTTP Digest Auth
}  svn –non-interactive –xml {subcommands}
}  xml2json
}  权限管理（RBAC，Role Based Access Control）

RMS服务

REST API

ascii coffee less uglifyjs security nas svn

cssmin yuicompressor closure compiler jsdoc

CDN 代码库安全中心应用 POC …

多进程设计
}  node-webworker
}  等待队列
}  一个进程一个工作流程
}  需要时从队列拿出，干完活或超时放回去

异步工作流
}  单向流程，由配置决定流程任务和顺序
}  每一个开发工具只是流程里一个任务
}  function run(content, next) { next(null, less(content)); }

配置接口
INPUT {filelist: [{
rev: 10086,
path: ‘$path’,
type: ‘JavaScript’,
steps: [
[‘coffeescript’, {}],
[‘compressor’, {tools: {JavaScript: ‘UglifyJS’}}]
], /*…*/]
}]}
OUTPUT {status: ‘start’, success: true, id: ‘$publishId’}

NodeJS的喜与悲
}  异步IO的简便
}  熟悉而陌生的JavaScript
}  NodeJS Best Practise
}  ECMAScript 5
}  接口测试
}  vowjs和api-easy
}  GC的改良（Stop-The-World when I am not busy)
}  手动GC（V8::LowMemoryNotification()）
}  第三方模块的数量量和质量量
}  native2ascii
}  版本库的访问
}  版本升级（0.4-0.6）
}  第三方模块的升级跟不不上(forever, less等)
}  node-webworker到cluster的迁移

使用NodeJS构建静态资源管理系统

More Related Content

What's hot

Viewers also liked

Similar to 使用NodeJS构建静态资源管理系统

More from Frank Xu

使用NodeJS构建静态资源管理系统