fex 发展历程-公司化运作
DESCRIPTION
FEXTRANSCRIPT
FEX 主要职责
负责研发「FE 通⽤用技术」并应⽤用⾄至产品线。
解决公司内「FE 通⽤用难点技术」和「复杂问题」，协助产品线提⾼高效率和收益，降低研发成本，提⾼高⽤用户体验。
FEX 是「社区基础技术部」中的「前端团队」，服务于全公司 BU。
⽬目前 FEX 产出已应⽤用⾄至公司 40+ 产品线，20+外部公司。
做最专业的前端团队
best or nothing.
我们是⼯工程师和艺术家
技术问题在这不是问题
我们将⼤大部分的时间
花在优化前端⼯工程技术
和提⾼高产品体验上
!
直到我们技术和想法
改变了⼯工程师与⽤用户
可能你都没有注意到
但你总能感觉到
这是我们的印迹
这也证明我们的价值
愿景
•･ 技术⽣生态。例，开源。开源是⼿手段，不是⽬目的，⽬目的是做⽣生
态。开源是由外推内促进技术更快发展的较好⼿手段。
•･ 技术宿主。技术需落地于产品线，产品是技术载体，是衡量技
术的唯⼀一标准，产品线不需的技术创新都是沙中建楼。
•･ 技术本质。提⾼高效率和收益，降低研发成本，提⾼高⽤用户体验。
原则
通⽤用技术
表现⼿手段
产品BU/⼯工程师
• 提⾼高效率!• 增加收益!• 降提成本!• 提⾼高体验
FEX蜕变
UXRPWebspeed
FMT
JS tangram &
magic
UEditor
FIS
UEditor - 富⽂文本编辑器
FMT - ⽆无线解决⽅方案
FIS - 前端开发解决⽅方案
JS - tangram 库以及 magic UI 组件
Webspeed - 性能团队
UXRP - ⽤用户⾏行为监控分析
2013.2 各技术⽅方向
UXRPWebspeed
FMT
JS tangram &
magic
UEditor
FIS
•･ 基础技术需要多少⼈人
•･ 各⽅方向划分的逻辑
•･ UXRP ⽤用户⾏行为监控的定位
•･ Webspeed 后续怎么办
•･ 编辑器还要做多久
•･ 要不要介⼊入 Native 开发
•･ ⼤大团队⼏几乎没有概念
•･ Flash 还要做多久
主要问题
迈出第⼀一步
•･ 去除语⾔言限制
•･ 甩开历史包袱
•･ ⼈人员优化
•･ 迈向产品线合作
砍⽅方向 - 甩开历史包袱•･ 暂停研发库和组件
•･ Tangram Library 后续思路⽅方向不明，功能向 jQuery 靠拢
•･ 库与组件开发与维护⼈人⼒力投⼊入⼤大，⼤大多数⼯工程师变成客服
•･ PC 端的组件变化多样，抽象难度⼤大
•･ UXRP 紧贴 UER（⽤用研）研究性质，交给 UER
•･ 撤掉短时⽆无⽤用⼦子⽅方向
•･ 撤掉单独的移动解决⽅方案团队 FMT
•･ Flash 同学转型
•･ JS ⽅方向调整为端⽅方向
•･ 取消⾏行政推动技术落地
FMT
JS tangram &
magic
UXRP
分久必合集中⽕火⼒力
UXRP
MVC
GMUUEditor
FIS
Webspeed端技术
开发平台 & ⼯工具
数据监控分析
Native
开源
Baidu
增多!需求!输⼊入
加快!技术输出
增加!技术创新
增加!招聘!渠道
加快!⼈人才输⼊入
培养成本!降低
技术覆盖⼲⼴广度
降低!跳槽成本
其他!公司
FEX 开源逻辑
增加员⼯工成就感
慎⽤用⾏行政权⼒力 让技术市场化
CBG 消费
SSG ⼤大搜FEX
移动云 国际化
LBS
技术产品TECH SALE
•･ 产品。如何找到⽤用户需求 •･ 运营。好的技术如何让⼈人知道 •･ 执⾏行。如何保证产品质量 •･ ……
• 400+ ⼯工程师!• 40+ 产品线!• 20+ 外部公司
象公司⼀一样运作
- T 型能⼒力结构 - 技术要求 全端/全栈 - 慎招社招，多⽤用校招 - 招聘⽐比⾃自⼰己能⼒力强的⼈人
技术 视野 产品 管理设计 沟通
⼈人员素质变化
问题
•･ 如何协作
•･ 团队如何衡量价值
•･ 技术如何具有持续性
•･ ⾃自服务能⼒力。单位⼈人员同时并⾏行服务产品线的能⼒力。
•･ 创新能⼒力。最近半年产出占最近 12 ⽉月产出的百分⽐比。
•･ 技术服务⼴广度。技术落地到产品线的⼴广度。
核⼼心指标
•･ 技术⼯工程⽅方⾯面。与产品线合作/产品线与 FEX 合作。
•･ 在线化与组件。产出 Demo/调研 给产品线。
•･ 通⽤用技术的选择。基本开发的是业务线重要⽽而不紧急技术。
协作
FEX愿景/机制/梯队/规律，以不变应万变
做最专业的前端团队
best or nothing.
我们是⼯工程师和艺术家
技术问题在这不是问题
我们将⼤大部分的时间
花在优化前端⼯工程技术
和提⾼高产品体验上
!
直到我们技术和想法
改变了⼯工程师与⽤用户
可能你都没有注意到
但你总能感觉到
这是我们的印迹
这也证明我们的价值
愿景
运⾏行机制
•･ 周报机制
•･ 技术规划及 Review 机制
•･ 知识沉淀
•･ 代码仓库
•･ 如何决策
梯队结构
•･ ⽅方向负责⼈人与决策
•･ 各⽅方向梯队梳理
•･ 招聘新⼈人标准技术/⽅方向 梯队/招聘
⼈人员成⻓长部⻔门⽅方向
数据监控
Web应⽤用
终端技术
⼯工程流程
我们已有哪些技术积累
图形 Canvas/SVG
HTML5 新技术 模块化Hybrid
前端监控MongoDB
模板技术NodeJS
前端安全
Android Native
WebComponent ⽂文本编辑
CSS 3浏览器技术
PHP
图形 Canvas/SVG
HTML5 新技术
模块化
Hybrid
前端监控
NodeJS
模板技术
前端安全
Android Native
WebComponent
⽂文本编辑
浏览器技术
PHP
MongoDB
HTML5 新技术
如何⽤用掌握的技术创造价值
脑图
原型交互
markdown
开发
下载
图像编辑
上传
测试
应⽤用 Web 化
单元测试
准⼊入测试
持续集成 ⾃自动上线
轻应⽤用
native
适配⽅方案
模块化
前后端⼀一体
MVC 框架
⼯工程框架
端 ⽤用户⾏行为
性能监控
上线
资源聚合
全流程
SDCH
SPDY
性能优化
Webapp ⽂文档⽣生成编译打包
开发包管理
资源打包⾃自动部署
codereview
异常监控
监控
运维⾃自动化
孵化
监控及反馈定位
存档分析
全流程
全流程
全流程
全流程
评估
价值评估
PPT
Docs开发⼯工具
Excel
端
资源合并
⾃自动报表报告可视化
组件化
组件化
ABtest
Webp
流程图
孵化全流程
插件管理
调试⼯工具 Webp
PPT
UXRP
UEditor
FIS
Webspeed DP
全端技术
开发平台 & ⼯工具
数据监控分析
Native
GMU
MVC
FIS Cloud
Formula
Minder
Web 富应⽤用
KityVisualization
前端价值评估
准⼊入平台 线下准⼊入
数据监控 性能及核⼼心数据 ⼯工程框架
性能优化实践
⼯工具平台 性能⼯工具检测
价值体系是 FEX 技术的基础
云服务
现有技术沉淀与输出
•･ ⽮矢量化底层 Kity •･ Web 脑图 •･ 「数说」可视化展⽰示 •･ 可视化⼯工具平台 •･ UML/架构图/Plan/PPT
•･ ⽂文本编辑器/协作编辑器 •･ 公式编辑/呈现全端应⽤用 •･ Baidu Word/Excel
图形/可视化 ⽂文本编辑 富应⽤用
•･ Node/Java/PHP/Go •･ F.I.S ⾃自定义解决⽅方案
•･ ⾃自适应静态资源合并 •･ FeatureFlag •･ 开发包管理
•･ F.I.S ⼯工具 •･ F.I.S 插件
•･ 性能监控 •･ 性能⼯工具 •･ 性能评估 •･ 性能预测
•･ 移动孵化平台 •･ GMU/FoxUI/轻组件
•･ 百度移动 2014 Q2 数据报告 5 天 100W UV •･ 移动微信游戏 5 天过亿 PVFEX Good news
FEX成熟
Kity Graphic Based
UEditor
FIS Tools
DP Full-End Monitor
技术⼯工程
GMU
Minder
⽂文本⽅方向
Native HybridFIS
Solar
FIS oak
PPT
Text Editor BasedMarkdown
Baidu Doc
Formular
Visualization
DP Tech Value Evaluate
FoxUI
Fuhua Markdown/Mocker
图形⽅方向
•･ ⼯工具框架 •･ 解决⽅方案 •･ 云端服务 •･ 全端监控 •･ 价值评估
•･ ⽂文本底层技术 •･ 富⽂文本 UEditor •･ Markdown •･ Baidu Doc
在线平台
•･ 图形底层技术 •･ ⽮矢量公式 •･ 在线脑图 •･ 可视化⼯工具 •･ 流程图 •･ …
•･ ⽂文本⽅方向 •･ 图形⽅方向 •･ UGC 平台
图形技术
⽂文本技术
模块化
Hybrid
轻应⽤用
客户端
浏览器技术
……
NodeJS
基础技术
CBG
SSG
移动云
LBS
国际化
公司内部
产品线
全端监控 DP
组件
内部创新孵化平台 fuhua
技术⼯工程化在线平台化
在线可视化⼯工具
开发⼯工具 FIS
解决⽅方案 FISP
价值评估 DP
在线脑图
在线原型图
流程架构图
可视化组件
UEditor
markdown
Baidu Doc
Baidu PPT
⽂文本组件
⼯工程框架框架 模块化 模板
总结与感悟
•･ 运⾏行机制与技术系统之美
•･ 共同的愿景与理想
•･ Leader 关键时刻需魄⼒力
•･ NB 的⼈人不⽤用管 ⼯工程师的⾃自驱素质
•･ 不要因技术问题⽽而放弃理想