Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
前端的云时代
Search
lifesinger
December 09, 2012
Technology
18
1.3k
前端的云时代
支付宝前端平台技术架构
lifesinger
December 09, 2012
Tweet
Share
More Decks by lifesinger
See All by lifesinger
SeaJS 与 Arale
lifesinger
12
1.4k
基于 SeaJS 的调试实践
lifesinger
19
1.7k
SeaJS 从入门到精通
lifesinger
44
7.7k
小脚本大世界
lifesinger
10
920
Other Decks in Technology
See All in Technology
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
cmusudakeisuke
1
250
COVESA VSSによる車両データモデルの標準化とAWS IoT FleetWiseの活用
osawa
1
290
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
180
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
9
73k
AI時代を生き抜くエンジニアキャリアの築き方 (AI-Native 時代、エンジニアという道は 「最大の挑戦の場」となる) / Building an Engineering Career to Thrive in the Age of AI (In the AI-Native Era, the Path of Engineering Becomes the Ultimate Arena of Challenge)
jeongjaesoon
0
130
要件定義・デザインフェーズでもAIを活用して、コミュニケーションの密度を高める
kazukihayase
0
110
ブロックテーマ時代における、テーマの CSS について考える Toro_Unit / 2025.09.13 @ Shinshu WordPress Meetup
torounit
0
130
S3アクセス制御の設計ポイント
tommy0124
3
200
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
8.7k
Evolución del razonamiento matemático de GPT-4.1 a GPT-5 - Data Aventura Summit 2025 & VSCode DevDays
lauchacarro
0
190
Platform開発が先行する Platform Engineeringの違和感
kintotechdev
4
570
エラーとアクセシビリティ
schktjm
1
1.3k
Featured
See All Featured
A better future with KSS
kneath
239
17k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.9k
The Cult of Friendly URLs
andyhume
79
6.6k
A designer walks into a library…
pauljervisheath
207
24k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Speed Design
sergeychernyshev
32
1.1k
Documentation Writing (for coders)
carmenintech
74
5k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
520
Writing Fast Ruby
sferik
628
62k
Transcript
前端的云时代
关于我 = { 姓名: 王保平 工作: 前端基础架构
微博: @玉伯也叫射雕 }
大纲 • 前端是什么 • 前端发展简史 • 支付宝业务场景
• 前端平台架构 • 总结与展望
前端是什么
前端在做什么
前端在做什么
前端在做什么
None
前端的职责 ① 实现界面交互 ② 提升用户体验
前端发展简史
萌芽期 • 功能单一、页面少 • 修改频繁、速度快 • 团队小、多面手
萌芽期的前端
萌芽期的前端架构 设计 前端开发 后端 开发
项⺫⽬目 管理 挑战:找到合适的人
幼年期 • 业务复杂、页面多 • 交互逐步复杂 • 修改频繁、速度快
• 角色多、流程杂
幼年期的前端
幼年期的前端架构 挑战:招聘、协作 脚本开发 页面构建 基础类库
编码规范 开发流程 …
少年期 • 业务高速发展 • 前端性能要好 • 核心业务要稳定
• 人多、分工细
少年期的前端
少年期的前端架构 挑战:专才培养、招聘 稳定保障 性能优化 基础类库
开发环境 流程规范 … 业务二组 业务二组 业务一组
前端典型问题 • 项目并发多、忙 • 难以深入业务 • 价值认可度不高
• 职业发展迷茫
下一步 ?
支付宝业务场景
支付宝 互联网 金融
对技术的要求 稳定 快速 品质 ⽆无线上故障
响应快 开发快 发布快 性能高 可维护性好 可适应性强
前端业务分类 展现型 功能型 { 给⽤用户看的 给⽤用户⽤用的
展现型
功能型
? 支撑 功能型业务 展现型业务
还要考虑人的需求 • 成就感 • 发展空间
前端平台架构
总体原则 • 保障业务的正常进行 • 兼容现有架构、支持并存 • 满足未来
3 年内的需求
上下游支持 • 设计和交互标准化 • 后端工程师达成往前走的共识
功能型业务 展现型业务 前端技术平台 前端技术平台 基础技术体系
基础设施平台 前端服务化 业务架构 业务架构 业务架构 业务架构
CMD 模块⽣生态圈 ⽀支付宝模块库 ⼀一淘 模块库 腾讯模块 ⽣生态库 B2B 模块库 Arale
Handy SeaJS spm 前端基础技术体系 百度模块 ⽣生态库
SeaJS h1p://seajs.org/ SeaJS 是一个适用于 Web 端的模块加载器
CMD 规范
spm h1ps://github.com/spmjs/spm/wiki 简单、放⼼心的包管理⼯工具
spm install spm upload spm build spm
deploy spm init …
Arale Arale 是⼀一个开放、简单、易⽤用的前端基础类库
h1p://aralejs.org/
Arale 开放式,尽量复用业界成熟方案
Handy h1p://handyjs.github.com/
基础设施平台 基础设施平台
展现研发平台 前端测试系统 ⽤用户体验分析平台 前端监控系统 ⺫⽬目标:为前端提供持续交付和监控分析
展现研发平台
用户体验分析平台 用户行为分析 网站流量分析 营销价值分析
前端服务化 前端服务化 前台前端服务化
后台前端服务化 ⺫⽬目标:让后端⼯工程师可以基于前端平台进⾏行⾃自主开发
后台前端服务化
前端业务架构 前端技术平台 前端 后端 前后端协作
由资源型团队转换成服务型团队 。。。
总结与展望
前端的云时代 前端技术平台 业务架构 业务架构 业务架构
应⽤用 终端 前 端 云
展望 • 模块生态圈的形成 • 前端技术的精细化 • 前端驱动产品
支付宝前端基础技术团队
seajs.log(“谢谢大家”) Q&A