前端极限性能优化合集

Back-End

  1. 使用Nignx做转发
  • 负载均衡
  • 限制对于资源路径的访问
  • 对静态资源自启动开启GZip压缩
  • 配合分布式服务器架构
  1. Redis,Vamish做缓存
  • 减少对数据库层面的读写操作
  • 缓存静态数据,配置,资源
  • 并发量大时,减少服务器压力
  1. 字段加密,字段压缩
  2. 静态资源分离,发布自动化

Front-End

  1. JS CSS文件极简化,减少文件大小
  2. 真正意义上将样式,配置逻辑embed到页面中,从而减少http请求
  3. 图片的压缩,静态资源CDN化
  • WebP格式(Web图片格式的未来趋势)
  1. 视图层使用js模板,或者完整的View框架(React),以Lazyload的形式分块加载
  2. CSS JS选择器ID化
  3. PC站点和移动端完全分开,拒绝响应式
  • 基本没有大公司选择用响应式
  • 多余的HTML结构和CSS样式
  • 同样的图片需要两套
  • 没人闲的蛋疼去缩放屏幕
  • 两套事件绑定
  • 资源体积文件过大,不利于优化
  1. 使用LocalStorage,存储用户状态,组件状态,非JS或者模板
  2. 给视图根本元素定义固定的Height和Width
  3. DNS网络解析加速,利用好站长工具
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前端极限性能优化合集 性能优化是老生常谈了,从雅虎的N条军规,前端各种优化准则,到2010年Google IO上S...
    梦幻_78af阅读 481评论 0 1
  • 性能优化方向分类 请求数量: 合并脚本和样式表, CSS Sprites, 拆分初始化负载, 划分主域(使用“查找...
    Www刘阅读 1,787评论 3 8
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 172,846评论 25 708
  • 网站优化离不开前后端的互相协作,但是对于前端工程师来说,在保证后端技术方案不变时,能不能只利用前端技术来优化网站呢...
    留七七阅读 6,366评论 0 31
  • 说明最近一段时间,男主已经有感觉你对我的爱情已经耗尽了,最后直至两相厌倦,那样的话可能连这场离别戏份都没有了。这样...
    黄沁馨阅读 1,310评论 0 2