1、-G町等M价镇万5巧01为什么苏宁要前后端分离 02苏宁的业务场景带来的技术挑战 03苏宁前后端分离的策略 04其他思考 Contents内容大纲 内容大纲 01 为什么苏宁要前后端分离 为什么苏宁要前后端分离 02 苏宁的业务场景带来的技术挑战 03 苏宁前后端分离的策略 04 其他思考 Contents 内容大纲 内容大纲 工作职责的细化工作职责的细化 美工+技术 UI/UE 前端 后端 DBA SA 随着互联网的发展，工作细分是长久以来的趋势 前端门槛的增高 前端门槛的增高 jQuery Angular React Vue Node.js 年抛的前端轮子们在把前端搞得筋疲力尽的同时，极大

2、的增加了全栈的学习成本.01 为什么苏宁要前后端分离 02 苏宁的业务场景带来的技术挑战 苏宁的业务场景带来的技术挑战 03 苏宁前后端分离的策略 04 其他思考 Contents 内容大纲 内容大纲 业务场景多 业务场景多 电商 业务 01 金融 业务 02 视频 业务 03 应用场景多 应用场景多 WAP WAP PC PC 小程序 APP Hybrid APP Hybrid 技术挑战 技术挑战 A 访问量大，每个问题都会被放大 大流量下要求高可用 B 还有坚持使用低版本浏览器的用户 浏览器兼容要求高 C 促销活动页很多 迭代速度要求快 D 商品搜索 SEOSEO支持 01为什么苏宁要前后

3、端分离 02苏宁的业务场景带来的技术挑战 03苏宁前后端分离的苏宁前后端分离的策略 策略 04其他思考 Contents内容大纲 内容大纲 技术方案 技术方案 前端模板 Ajax+字符串模板 MVVM Vue React Node模板 Express+ejs SSR Node+Vue SSR 浏览器兼容 浏览器兼容 Web模板 Vue Node SSR IE6+IE9 IE6+IE9+在浏览器兼容中，基于现代MVVM框架的技术方案，处于劣势，在浏览器兼容性要求较高的场合中，无法使用 SEO支持 SEO支持 Web模板 Vue Node SSR 对于SEO有要求的网页来说，使用Web模板和Vue

4、方案，不大适合 首屏渲染耗时 首屏渲染耗时 HTML+JS（较小）+Ajax+拼接字符串 HTML+JS（较大）+Ajax+Vdom+渲染 RPC+HTML（拼接时间较短）RPC+HTML（拼接时间较长）Web模板 Vue Node SSR 异步接口速度 异步接口速度 直接请求后端HTTP 直接请求后端HTTP 请求Node+RPC 请求Node+RPC Web模板 Vue Node SSR 高可用 高可用 85%70%65%50%Web模板 Vue Node SSR 相对来说，Node相关的技术门槛较高.50%Web模板 70%Vue 90%SSR 80%Node 技术门槛 技术门槛 20%

5、无分离 40%Web模板 90%SSR 70%Node 40%Vue 显然前后端分离会导致web前端工作量增加 前端工作量 前端工作量 60 60 100 Web模板 Vue Node 100 SSR 前后端分离度 前后端分离度 渐进提高前后端分离度 渐进提高前后端分离度 浏览 转向Node.js中间层 应用 转向Node.js中间层 视场景使用SSR 核心电商类 对于浏览器兼容性要求，可用性要求，页面性能要求都极高的电商类页面 不使用前后端分离配合少量web模板.渐进提高前后端分离度 浏览器兼容要求较高的活动展示页，逐渐从Web模板过渡为Node模板 渐进提高前后端分离度 核心应用型Web页

6、，对可用性要求占主导。过渡为Node+Vue.js方案 渐进提高前后端分离度 兼顾 性能要求高 渐进过渡到方案 渐进提高前后端分离度 团队推进中，根据团队实际的情况，也应该是渐进的.渐进的在团队中推进前后端分离 初期团队 成熟团队 技术实力 人力富余 技术风险 团队配比 进度要求 评估风险边界，保持业务稳定 渐进的在团队中推进前后端分离 选择切入时机 果断与谨慎 业务开发中，多选择新业务推进高级分离方案 对于老业务改造，应该循序渐进，选择新需求 渐进的在团队中推进前后端分离 01为什么苏宁要前后端分离 02苏宁的业务场景带来的技术挑战 03苏宁前后端分离的策略 04其他思考 其他思考 Contents内容大纲 内容大纲 前后端同构 A B 云服务 C 精英小团队 全栈化思潮 全栈化思潮 可能代替网页 A B 代替重复性劳动 C 职业天花板 E 轮子学习成本 前端开发职业前景 D 多语言能力要求 前端 前端 Alan Bennett“标准总是过时的，这让它们成为了标准。”THANK YOU