Skip to content
fis-dev edited this page Sep 15, 2013 · 1 revision
F.I.S = Front-end Integrated Solution(前端集成解决方案)

首先让我们来看一个真正的前端团队要开发一个产品时所需要经历的过程:

  • 第一阶段: 规范与设计
    • 定制必要的开发规范
    • 定制项目的组件化拆分方案
  • 第二阶段: 技术选型
    • 选择前端组件化框架(seajs, requirejs, ...)
    • 选择前端基础库(jquery, tangram, ...)
    • 选择模板语言(php, smarty, ...)
    • 选择模板插件(xss修复)
  • 第三阶段: 自动化与拆分
    • 选择或开发自动化工具(打包,压缩,校验)
    • 将系统拆分为几个子系统,以便大团队并行开发
    • 适当调整框架以适应工具产出
  • 第四阶段: 性能优化
    • 小心剔除已下线的功能
    • 优化http请求
    • 适当调整自动化工具以适应性能优化
    • 使用架构级优化方案:BigPipe、BigRender等

以上阶段,是所有大型应用前端团队都会经历的阶段,我们将 其中的技术需求总结为前端集成解决方案。 通常,一套完整的前端技术解决方案包括四个方向:

  • 前端框架:提供组件加载及管理框架支持,提供前端基础库及组件库。
  • 模板框架:提供组件化开发模式支持;配合前端框架收集页面所需要的最小静态资源需求;留有充分的性能优化空间,性能优化对工程师透明。
  • 自动化工具:提供基本优化能力;为前端框架、模板框架提供辅助支持。
  • 辅助开发工具:提升工程师的开发体验,降低调试、部署成本。
so,如果你的团队已经拥有以上四项技术基础,那么恭喜你,你已拥有了一套fis。

这样的过程每天都在前端界上演,那么,有没有办法让这个过程简化,让前端团队可以快速进入角色,而且不用担心未来的自动化、性能优化等问题呢? 答案是肯定的!

F.I.S@百度

2011年底,百度web前端研发部成立F.I.S团队,汇集了来自各产品线的精英工程师,该团队的任务是寻找提升前端工业生产力水平的解决方案。经过1.5561643836年的努力,fis团队和百度众多产品线共同探索出一套前端集成解决方案,解决了前端生成中遇到的诸多问题,包括但不限于 前端静态资源加载优化、页面运行性能优化、基础编译工具、运行环境模拟、js|css组件化开发 等前端领域核心问题。如今,fis团队的解决方案已应用到百度30多个产品线,覆盖了从pc到无线终端的应用,极大的提升了前端团队的生产力,降低了开发成本。

2013年初,fis团队总结了之前在前端集成解决方案领域所做的探索,将整套方案整理开源,希望能为前端工业化提供新的思路。