今日份前端

157 阅读2分钟

V8:

     5.1中 垃圾回收采用并行压缩,并行记忆集处理和黑色分配。

             记忆集:类似哈希表这种具有记忆的数据结构,查找不需要遍历。

             黑色分配:旧生代的对象会被标记黑色,被认为是持久化,在垃圾回收时不会被访问。(被标记为黑色的对象至少是经过垃圾收集器提升的,即活动对象经历过至少一次垃圾回收周期)

    Chrome 57 开始默认支持 WebAssembly

    web性能危机:用户不能接受平均加载时间3s及以上的网站,前端优化可以从以下角度出发:

     缓存:浏览器对于两天内重复出现的脚本自带缓存,通过反序列化源对象上的缓存数据,跳过编译阶段,而前端可以跟后台约定接口的缓存策略,cdn加速提高资源下载速度,并且设置hash值或时间戳确保资源新鲜度。

     资源过大:js文件过大可以启用gzip压缩,以及通过webpack,tree-sharking分包,剥离,剔除没有被使用的代码。

     首页白屏:不要在一开始就加载所有的资源,通过懒加载的形式,只加载当前页面需要的资源,以及ssr的形式在后台渲染好,或者预编译组件。

     页面交互:对于频繁的页面交互,如实时搜索可以通过web woker 启动并行线程处理,这样不会影响主线程的渲染。

     http请求过多:合并小资源,例如css-sprite 雪碧图。

     开发阶段:随着时间推移,项目体积越来越庞大,可以配置webpack DllPlugin预编译来提升开发效率,通过将依赖包预编译后,再次打包时会跳过,直接使用已经预编译的文件。

 Javascript:

     模块机制:import export

      Object.keys 返回key数组,Object.values 返回value 集合。

     Object.entries返回可枚举键值对数组。

     Async/await 异步控制