V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
ltoddy
V2EX  ›  2018

浅谈前端优化的几个思路

  •  
  •   ltoddy · 2018-04-19 18:31:38 +08:00 · 1185 次点击
    这是一个创建于 2411 天前的主题,其中的信息可能已经有所发展或是发生改变。

    浅谈前端优化的几个思路

    雪碧图

    页面中如果有很多图片、icon(小图标),这样会有很多 HTTP 请求,一个图就是一个 HTTP 请求,建立 TCP 连接进行三次握手,这些都是耗费时间的.如果页面 icon 很多,可以考虑用 css spirit(精灵,汽水雪碧也是这个单词)技术做一张雪碧图,将请求多个 icon 变成一次 HTTP 请求.(可以用 webpack 来配置实现)

    lazy load (懒加载)

    如果页面内容多,页面长度长的话,可以考虑懒加载,先加载页面最上面的内容,然后滑动到哪加载到哪.

    CDN

    这个是一个很大的关键,在公司静态资源肯定是走 CDN 服务的,什么是 CDN 呢,比如,你去网络请求一个资源,你在北京,而资源在南京, 中途很远,要经过很多个路由器(转发请求),这样会占用很多时间.所以可以用 CDN 服务,简单来说 CDN 就是在各个地区布置节点, 缓存你的资源,这样你就可以就近的拿到你要的资源了.

    webpack 配置

    听说大公司都有专门写 webpack 配置文件的岗位,webpack 如果配置的好,也可以提高很多速度(比如可以把你的 js 文件压缩的更小).

    前端拦截

    前端也是可以做数据娇艳以及重定向这样的事情,能前端决策的一定要决策,因为比如重定向在前端做了,这样就不需要访问后端,也可以减小服务器的压力.

    最后一点,代码质量

    我前端框架用的是 react,要多多关注 react 生命周期,等等很多方面.

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5496 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 34ms · UTC 09:33 · PVG 17:33 · LAX 01:33 · JFK 04:33
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.