购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

1.3.3 从框架到框架无关

Web世界的变化非常迅速。起初,网页服务只是把静态文档托管在服务器上,任何人都可以通过互联网访问。随着人们对页面的需求不断增加,逐渐出现了一些专门为Web而生的技术,如PHP。PHP可以在HTML中直接访问后端代码,从而实现动态内容,并将变化的内容存储到后端数据库中。随着动态内容需求的不断增加,如Flash等技术也应运而生。随后,JavaScript的应用开始显现,著名的jQuery得到了广泛的应用。页面被做得越来越复杂,开发者开始探索MVC、MVVM等架构,同时也在不断探索更为复杂的应用场景。

随着单页面应用( Single-page application, SPA )慢慢成为主流,复杂且庞大的单页面应用需要许多小组件之间实现数据同步,复杂性导致Bug层出不穷。为解决这个问题,Facebook的软件工程师Jordan Walke在2011年编写了FaxJS,后来改名为React。React的出现解决了页面状态和页面渲染之间的同步问题,将页面渲染放在DOM上,而将页面状态处理放在JavaScript中。

2013年,还在谷歌工作的尤雨溪做了一个非常庞大的UI界面,因为这个界面非常复杂,且有很多重复的HTML,他开始寻找一些工具来帮助完成这项工作。然而,他发现没有现成的工具、库或者框架能满足他的需求。因此他决定开发一个工具来帮助自己,这就是Vue.js的前身。

随着React、Vue等工具的诞生和广泛使用,开发者可以编写越来越复杂的前端应用,这些工具采用声明式编程风格的内核也催生了开发者们对组件式开发的推崇。与此同时,前端开发界对工具的需求也变得越来越强烈,Webpack、Rollup、ESLint、Prettier等优秀的前端工具也应运而生。每个框架都形成了自己的生态系统,开发一个应用程序需要选择一个框架,再从该框架的路由、状态、hooks库及UI库中挑选。这导致了一个问题,即框架绑定和隔离。在一个框架中创建的库通常不能在另一个框架中使用。

近年来,这个问题得到了一些改善,TanStack在2022年开始做 框架无关化改造 ,其Query项目前身是React Query,目前经过改造,已经可以同时支持React、Vue、Solid和Svelte。实际上,这些年前端框架之间相互学习借鉴,响应式核心的实现都有相似的地方,这为实现类似TanStack项目提供了可能性。在前端开发中,不熟悉CSS的开发者会选择使用对应框架的UI库,这样可以提高开发效率,但是在深入使用后可能需要修改样式。通常UI库为了提供简便的用户接口,会对CSS/SASS进行深度封装。因此,如果要修改UI库的样式,就需要理解其封装的代码逻辑,这样的成本较高。Tailwind的诞生解决了这个问题。站在使用UI库的角度看,Tailwind提供了标准的样式基础协议,解耦了CSS和JavaScript之间的关系,Tailwind社区发展非常健康,出现了如DaisyUI这样的框架。DaisyUI是封装在Tailwind之上的框架,只提供了CSS相关的封装,这样如果想要修改其中的逻辑,也只需要处理样式相关的代码即可,降低了二次开发的成本。还有很多优秀的项目都在尝试框架无关化,如Volar。Volar最初诞生于为Vue提供VS Code的语言服务,现在正在孵化Volar.js,期望对所有框架提供语言服务。

随着框架的不断涌现,出现了许多优秀的项目。这些项目不断发展壮大,逐渐与原始框架解耦,形成了框架无关的新项目。或许在不久的将来,前端开发将不再像2022年那样,需要学习如此多相似的技术,而是只需要掌握像TypeScript这样的几个项目即可。 开发者不再疲于奔命地学习新技术,而是可以更聚焦在自己的业务上。 Dbh8BaP2xxlniEMD0DoSvb7T6Yzl1XEOGVTPn0WVm/ykiFPRj1uzOVXoYi3ZvgIl

点击中间区域
呼出菜单
上一章
目录
下一章
×