说说前端未来几年的发展方向

在知乎上看到这么一个问题,觉得很有意思,以下是原提问者的见解

过去五年前端的发展过程基本上是一个工程化的过程,框架和工程化工具层出不穷。

近两年其实发展已经比较迟滞了。

框架方面:基本就是三大框架鼎立的局面,三大框架都在相互借鉴吸收,而且方向各有侧重,未来短时间内我看格局不可能有什么大变化.

工程化工具:基本上是 webpack 一统江湖的趋势,虽然有 parcel 等来小打小闹,但是生态一旦形成,没有革命性的项目是无法取代 webpack 的,而且 webpack 也在进化.

个人认为前面五年是前端生产力提高的五年,工程化使得前端的生产力得到了极大提升,但是现在也基本上是在已有的格局中修修补补了

我谈谈我对前端未来几年的发展方向的看法。

看未来的发展方向,无非就是看现在的解决方案所存在的痛点。

1. 浏览器的性能问题

做 web 前端的同学都知道,和原生的 App 相比,性能一直一个致命的痛点,如果要追求性能,肯定得用原生 App。那么在性能上,未来几年可能是一个方向。

①前端代码编译为字节码

浏览器这几年在 Chrome 的带动下,性能飞速发展,但毕竟其核心原理没有变化,性能始终难以达到原生 App 的水平,这部分是很有可能出现大的变化的,一个可能的方向就是浏览器变成虚拟机,前端代码编译为字节码,通过这种方式来将性能提升一个等级,虽然还是难以达到原生App的水平,但已经能够满足绝大部分应用的性能需求,类似于Java对比C/C++一样。    --李运华

因为 js 是边解释边执行的,这肯定是要比编译型语言要慢,为了解决解释器的低效问题,大概在 2008 年的时候,提出了 JIT 的概念,它是使 JavaScript 运行更快的一种手段(JIT,内联缓存和隐藏类)之一,通过监视代码的运行状态,把 hot 代码(重复执行多次的代码)进行优化。通过这种方式,可以使 JavaScript 应用的性能提升很多倍。

但是时至今日,还是觉得不够快,所以各大浏览器厂商开始支持 WebAssembly。WebAssembly 是一种新的字节码格式,主流浏览器都已经支持 WebAssembly。

和 JS 需要解释执行不同的是,WebAssembly 字节码和底层机器码很相似可快速装载运行,因此性能相对于 JS 解释执行大大提升。

也就是说 WebAssembly 并不是一门编程语言,而是一份字节码标准,需要用高级编程语言编译出字节码放到 WebAssembly 虚拟机中才能运行.

他的优点就是:

  • 体积小:由于浏览器运行时只加载编译成的字节码,一样的逻辑比用字符串描述的 JS 文件体积要小很多;

  • 加载快:由于文件体积小,再加上无需解释执行,WebAssembly 能更快的加载并实例化,减少运行前的等待时间;

目前可以编译成为 WebAssembly 字节码有 :AssemblyScript(语法跟 TS 差不多,)、c\c++、Rust、Kotlin。

②统一的DOM树限制了单线程的渲染

理论上来说,一个页面某个时间变化的部分只是集中在一小块区域,没有必要将整个DOM树锁住。因此,一个可能的方向是分区渲染,即将页面划分为几个不同的区域,每个区域有独立的DOM树,独立渲染,那么性能会高很多,类似于 App 开发中的组件,组件类的运行不影响其它组件,如果需要依赖其它组件,通过组件间消息进行通信。

原生 App 不同平台重新开发的痛点

现在的 web 有两大优势,一个是浏览完毕直接走人,另外一个是跨平台,只要有浏览器,一切都好说。

所以现在有很多 hybrid 解决方案,某些页面通过 h5 的方式来展现。

想解决的无非就是少花点成本,写一份代码,可以在 ios 和 Android 上都可以用,进而也出来了想 RN、weex、NativeScript 这类 Learn Once, Write Anywhere(RN提出来的) ,但是他们最终都会翻译成原生代码。

但是用过这些的人都知道,还有很多坑,经常调侃 rn 的就是 write once ,debug anywhere。

Learn Once, Write Anywhere 的理念,背后就是跨端的思想,所以也诞生出来 electron、PWA 为代表的案例。

而且现在出现了 Taro 、mpvue 这些 h5 与小程序的统一的方案,所以未来在突破写一份代码在 h5 ,原生 app、小程序,甚至桌面应用都有可能。

另外提醒

  1. 我很早就跟星球里的朋友们说过,TS 一定会在火的,现在用 TS 的感觉,让我感觉跟 vim 很像,刚开始用的时候很难受,一旦习惯了就离不开了。未来项目会越来越复杂,用了 TS 项目的风险会可控很多。

  2. 多注重框架原理,现在对于前端工程化,个人认为差不多到了瓶颈期,很难有新的突破,注重原理才能很好的应对未来的发展。

  3. 眼界放宽、拓宽自己知识的广度。

欢迎大家把自己对未来几年前端的看法在留言区讨论,以上仅为个人观点。


公众号【前端桃园】

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,186评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,858评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,620评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,888评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,009评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,149评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,204评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,956评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,385评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,698评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,863评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,544评论 4 335
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,185评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,899评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,141评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,684评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,750评论 2 351

推荐阅读更多精彩内容