如下是今天我们要一起讨论的技术:
Webpack5
Flutter
React16.8 && Vue3
TypeScript
更多...
--------------------------------------------
1. Webpack5当前进展
Webpack作为前端工程华中必备的一环,在前端开发中承担着非常重要的角色。可以说火的一塌糊涂,但是笔者经历过Webpack1、2、3、4和FIS1、2、3之后觉得Webpack其实还是可以做的更好。其中包括固定 moduleIds & chunkIds来做前端持久化缓存等等。我们发现在最近的新版本中已经完成到可用状态。
如下是Webpack5.0 新特性,感兴趣的读者可以移步到之前笔者写的这篇文章会有详细的步骤带你了解最新的Webpack5.
1.dist打包文件测评
2.让人揪心的按需加载
3.moduleIds & chunkIds得已确定
4.饱受诟病的编译速度
5.minSize&maxSize 更好的方式表达
6.编译器的优化
-
7.Node.js polyfills 自动被移除
2. Flutter
Flutter作为正式发布才刚刚半年的新技术已经席卷了整个大前端圈子,成为了当之无愧大前端的焦点之一。
如果你从网上去搜索Flutter,得到的定义大部分是这样的,Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。
但是在今年它已经支持Web应用开发了!没错你没看错!来啦来啦它真的来啦,可能你还没有从Angular8的发布中苏醒过来,但是Flutter Web一定值得你的关注。
Flutter Web的总体架构与用于移动平台的Flutter非常接近:
Flutter框架(上图中绿色部分)在移动和web平台中共享,它提供了Flutter的UI基础层的高层次抽象,包括动画、基础组件类、以及大多数应用需要的物化主题的组件集。如果你已经在Flutter上开发,那么使用Flutter Web时你会感到非常熟悉。同时Dart也在突飞猛进,它可以被用于web、服务器、移动应用和物联网等领域的开发。这也恰恰和如今的大前端不谋而合。因为大前端不再是以前的页面仔和组件仔,而是可以完成 AI、VR、AR、iOS、Android、PC、Server、智能硬件的综合性人才。
3. React16.8 && Vue3
今年6月份的Vue Conf大家应该对这张图的印象非常深。
等等,我们看一下React官网的一个Demo
哎呦,总感觉哪里有些相似?嗯,今年我们确实彻底迎来了函数组件+Hooks的时代。我们没有资格去对Vue或者React去做什么点评,真香定律,可能你会说我以前的extends的面向对象写法要改成这样,要变化太多了啊,记得别喊真香??。随着React 全新的 Context API和React Hooks的useReducer、useContext你会发现Redux有些尴尬的处境
Mobx倒是对拥抱Hooks带了更多的诚意推出了mobx-react-lite。
4. TypeScript
官方解释:TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。说成人话:拥有了强类、抽象类、接口啥那些之后端语言才有的语法特性的Js。
我们为什么需要他?大家来看这张图。
核心的地方在哪?Bytecode到Bytecode optimization,怎么做到的?通过type feedback,那使用Ts能咋样?刚好配合V8 type feedback,让代码少出错,让代码更高效,让语法糖更甜。
配置起来烦不烦?烦!?
学起来难不难?难 !?
最后跑起来爽不爽?爽 ! ?
do it Finish !干就完了~ 希望大家能够更好的拥抱TS,因为各个团队都在慢慢融入到项目中。因为React和Vue都是基于TS写的,因为比较成熟的库等等都是基于TS作为首选Demo~
5. 更多
本来想继续往下去写一些具体的技术细节,突然停笔不想写了。为什么呢?因为摸了摸我日渐圆润的肚子和键盘的些许头发,我得出去运动一会了。但是还有更多的一些技术热点和趋势我想告诉大家,请大家能抽出时间仔细研究。
Web Assembly、WebXR Device API、WebRTC 和 MSE、Web Fonts、Web 与 AI、Web监控包括 Performance Timeline、server, resources、tasks, element, paint;Web优化包括 scheduling background tasks、resource loading、visibility;Web报告包括 beacon, network error 等、WebAuthn、CSS Houdini、更多的前端图形学等等等等等等等…..
前端技术路漫漫,成长的曲线非常的陡峭。也希望大家能够跟上这个时代,工作顺利。此致敬礼~