首页
ARTS 11 - 前端升级到 gulp4+ babel7

ARTS左耳朵耗子 提出来的一个打卡任务。每周一个 Algorithm,Review 一篇英文文章,总结一个工作中的技术 Tip,以及 Share 一个传递价值观的东西!我希望这个事可以给大家得到相应的算法、代码、技术和影响力的训练。

这是我的第十一周打卡。这周主要分享一下前端项目从gulp3升级到gulp4以及babel升级到babel7的历程。

🤖 Algorithm

平衡二叉树

📖 Review

Improving Browser Performance 10x

这篇文章主要讲的是作者把 Universe.com 的主页性能提高了10倍的一个过程,以及涉及到的技术。

首先,页面的访问速度对于一个网站来说是至关重要的,如果加载时间过长,用户的流失率就会不断增加。作者对于网站性能的重要性列举了常见的几种:

  • 用户体验
  • 转化率与收入
  • SEO

然后介绍了提高页面性能的几个方面:

  • 性能测量
  • 渲染
  • 网络
  • 浏览器中的 JavaScript

对于性能测量我们可以使用一些现有的工具来完成。一般会分为两个方向:开发环境的性能测试和生产环境的性能测试。渲染的话,目前前端的渲染方式有很多种可供选择,大体上分为三个方向:服务端渲染(SSR)、客户端渲染和预渲染。网络这一块,我们可以使用 CDN、WebAssembly 边缘计算等技术来进行加速。缓存对于性能提升也是非常重要的,我们可以通过 CDN 发送 Cache-Control、webpack 给静态资源生成 hash 值等手段来完成。浏览器中的 JavaScript主要指的就是前端静态资源的加载了。通过压缩文件体积、减少依赖性、代码拆分、异步和延迟加载脚本等手段来进行优化。

思考:

前端的性能优化,它是一个非常庞大的体系,涉及到方方面面的知识。有的公司会有增长黑客这种职位,专门来做这方面的工作。但对于中小型公司来说,资源是比较匮乏的,所以我们开发人员经常也需要关注这方面的问题。如果因为页面的打开速度导致用户流失,这是得不偿失的。所以,我们平时需要积累这方面的知识,关注常用的工具等等,以防不时之需。

💡 Tip

前端项目升级到 gulp4 + babel7

💎 Share

分享gitbook:函数式编程指北

这本电子书主要是通过JavaScript这门语言来讲解函数式编程这一编程范式。随着前端的ReactRedux大火,函数式编程在前端领域又变得火热起来。像它们的immutable纯函数高阶组件等都是运用了函数式编程的思想。

对于前端的场景,其实我们更关注于组件的状态变化而不是业务模型之间的关系,后端的OOP体系在前端并不是很好用。通过系统地学习并了解函数式编程的思想,我们再来看前端的这些框架,就更清楚它们设计的目的了。