CSS：

JS：

框架：

构建工具：

webpack4.x
image.png

前端工程：

前端工程化：分而治之
前端工程四个阶段：

  • 第一阶段：库/框架选型
  • 第二阶段：简单构建优化
  • 第三阶段：JS/CSS模块化开发
  • 第四阶段：组件化开发与资源管理

    模块化组件化开发

    image.png

    静态资源管理

    控制资源加载，通过各种手段在运行时计算页面的资源使用情况，从而获得最佳加载性能

静态资源版本更新与缓存

利用query的方式清除缓存会存在，覆盖式发布 的上线问题？
image.png
目前来说最优方案就是 基于文件内容的hash版本冗余机制

性能优化

性能优化方向，性能优化手段
image.png

项目问题