前端&服务器
26
前前 & 前前前 前前前
description
Transcript of 前端&服务器
前端 & 服务器郑新林
• 前端的代码结构。
• 我们需要什么样的服务器 。
• 前端的开发框架。
分享的主题
前端的代码结构图
前端的代码开发图
当前的问题
• 集中式管理的问题：– 分支庞大，效率不高。
– 分支间可能存在互相干扰。
优化方案分析 – 拆封
CBU
A 产品 B 产品 C 产品
B 产品
A 产品
C 产品
（新）各个产品线独立更新
拆分代码结构
拆分代码结构
我们需要什么样的服务器
• 稳定性，稳定压倒一切
• 发布效率，效率！！！
• 优良的性能
拆分后的优势
• 产品线独立，互相不干扰。
• 分支体积变小，提高操作效率。
• 发布不阻塞。（需要发布平台支持）
现行的发布流程
集合，一起通过独木桥
拆分后的发布流程
各找各妈，各回各家
AONE 上面如何变化
• 发布过程几乎和原来一样
• 发布窗口是原来的 N 倍– 选择代码分支的地方，选择变多
– 发布的产品线变多
– ….
• OPS 怎么办？ 三头六臂～
发布窗口的控制问题
• Why OPS
– 绕过 OPS ！！！
• 权限下放，人人都能发布到预测试– 大家愿意么？
• Aone 的现有流程能保证分支不丢失
发布流程控制发布流程：
Aone 发布 QA 预发布验证
失败
成功
响应，发布上线
预发布成功，则 QA 响应发布流程，发布上线预发布失败，则发布服务器撤销刚才的发布，释放发布窗口
版本回滚
Aone 获取发布权锁定不让其他发布介入
改进能带来什么 ?
• 发布效率，让发布不再煎熬
• 响应更迅速，不再纠结发布窗口锁定
我们应该改变 Aone
• 而不是被 aone 改变
• 相比他们，我们对于前端服务器的需求更清晰
• 改变 Aone ， Why not ？
前端开发框架
• 代码结构
• 服务器其实都是前端开发框架的一部分
前端开发框架
• 对多人、多团队的开发 提供良好的支持
• 开发、测试环境（本地、线上）
• 测试工具、方法，测试框架 ( 略… . )
本地开发环境
本地开发环境
$include(“core/core.js”);
$include(“lib/template.js”);
$include(“http://style.china.alibaba/online/cbu/common/alitalk.js”);
function main(){
// TODO XXXX
}
版本控制
Aone 发布脚本
cbu/search/yyyy.src.js => cbu/search/yyyy.js
aone 根据当前应用的大版本号 2.0 , 将合并后的代码，发布到
cbu/search/2.0/yyyy.vnamber.js
version file (jsv_yyyy = vnumber)
后端服务器 获取 version file ，模板相应更新脚本请求
<html>
<script
src=“style/online/cbu/search/2.0/yyyy.$!{JSV_yyyy}.js”></script>
SVN 代码结构
Dev model online model Model updated
VS 独角兽方案独角兽
发布代码与分支一样
独角兽提供线上 merge
解决缓存问题
问题：
版本问题，文件的多版本并存问题没有解决
js 文件多级 include 的文件变动探测问题，没有解决
需要服务器支持
需要后端应用支持
前述方案
代码发布时，需要 aone 合并代码
线上代码是静态的
多版本并存
解决缓存问题
问题：
版本文件累积（回收机制）
需要后端应用支持
Facebook 的静态服务器
• 静态资源模块化GWT 类似的 PWT
• 智能分配资源
不仅仅是页面级别
用户行为分析
魏小亮
Thank You
