停止编写Javascript框架吧。

  Javascript框架就好像死亡和税收一样:终究不可避免它的存在。我确信如果我是那面墙上的一只苍蝇,每次有人开始一个新的网页项目时,第一个问题肯定是我们用的是哪个JS框架?这就是当今业内对JS框架的根深蒂固的思维模式。但事实上并不需要如此,相反的,需要停止使用JS框架。

  我们来看看我们都有些什么。

  Angular、Backbone和Ember,哎哟妈呀

  很长一段时间内网页平台、技术堆栈对于HTML+CSS+JS最简洁的描述就是灾难(缺少一个更好的解释)。谁能忘记IE的盒子模型或层标签?我相信我只用了这几个词就让你们其中一些人一下子回到了那个不堪回首的网页开发时代。

  在很长一段时间里浏览器之间有一大堆的不一致,作为业内人士的我们不得不编写框架来掩盖这些问题。问题是连一些根本性问题,各浏览器之间都不一致,比如事件是怎样传播的或者支持什么标签,所以每个框架不仅仅是弥补这些漏洞,还要设计他们自己的浏览器运行模型。实际上他们的模型,许多模型,因为你必须为事件传播发明一个模型,为DOM发明一个模型等等。许多模型的发明创造还在继续。所以编写了一个个框架,每一个都如同一片雪花,上千上万的花朵绽放了,给我们带来了jQuery和Dojo和MochiKit和Ext JS和AngularJS和Backbone和Ember和React!在过去的十年里,我们已经炮制了一大堆JS框架。

  但是在过去的十年中还有很多其他事情发生了;浏览器比之前更好了。浏览器对于标准的支持有了很大的改善,现在有些持续发展的浏览器:它们可以自动更新浏览器,每一个新版本都有更好的性能和对标准更好的适应。新标准如下:

  • HTML导入
  • Object.observe
  • Promises
  • HTML模板

  我认为是时候重新思考下JS框架模型了。现在已经不再需要创造另一种方式了,使用HTML+CSS+JS就行了。

  那么为什么我们还要编写JS框架呢?我认为原因大概是惯性,这是种习惯。但是它的确不好使,它不像框架是有主动危害性的,对吗?好吧,我们先来看看用网页框架定义我所说的。实际上这是一个有梯度的代码,它以一小段代码开始,如同代码的主旨,然后是大段大段的代码汇总,再上升至库,最后是框架。

  主旨->库->框架

  框架不只是一个比较大的库,框架还有与事件和DOM等互动的模型。那么为什么不用框架呢?

  抽象性,框架的一个问题是他们的卖点,框架从平台中抽象出来,所以你可以关注在构建你的软件上。问题是现在你有两个系统需要学习,HTML+CSS+JS和框架。如果框架是一个完美的从网页中抽离出来的如同平台一样,你就不用越过框架,但是猜猜怎么着,框架不是那么完美。所以你必须知道HTML+CSS+JS,因为某些情况下你的程序不会像你想象中那样运行,那么你就要一层一层的检查框架,去查出哪出错了。直到检查到HTML+CSS+JS。

  绘制冰山

  框架就像个冰山,10%漂浮在水上面,开起来并不危险,那隐藏的90%才会要了你的命。事实上还有更多的apt,学习一个框架就像绘制一座冰山,为了使用框架你需要学习整座冰山,但最终运行的进程都是没有意义的,因为冰山会融化的。

  小部件,另一个框架的卖点就是你可以读取访问小部件的库。但你的确不需要通过框架来访问小部件,它们都应该是独立的。一个很好的例子就是CodeMirror,一个用Javascript做的语法高亮显示代码编辑器。你可以在任何地方使用它,不需要框架。

  用框架做小部件也会失去你之前所做的努力。记得所有那些你写的MochiKit小部件吗?对的,现在将其转移到Ember或Angular,那些小部件还好使吗?

  数据绑定,说实话我从来没需要过它,但是如果你需要,那么应该是库,而不是框架。

  框架的一个更长期的问题是框架终结时会成为silos,他们为框架A分割的landscape和小部件不能在框架B下运行。你的努力都白费了。

  那么后框架世界是什么样的?

  HTML+CSS+JS是我的框架

  基本理念是框架是不需要的,用HTML+CSS+JS的内部功能创建你的小部件。将整块的材料分成正交分量,并可以任意组合。最终的碎片都可以在web组件的大伞下。

  HTML导入、HTML模板、定制元素和Shadow DOM都是允许我们切断框架核心、创建可再次使用的元素和功能的技术。更详细、更好的介绍请参考以下文章和库:

  • HTML导入
  • Polymer
  • X-Tag
  • Bosonic

  那么,我们创建<x-flipbox>,宣布胜利,然后回家?

  不,用Web组件你需要做的第一件事就是针对此功能的腻子膏,如X-Tag和Polymer。对于这部分的需求随着时间减少,因为浏览器将这些规格的实施具体化。

  强调一点,这些腻子膏不是框架,采用他们自己的模型开发网页,腻子膏可以使用HTML5模型。但是这并不是唯一需要的,在同一平台下还是有些细小的差异,因为现行标准,浏览器会在一些细小的方面产生偏差,这就需要腻子膏。MDN貌似需要很多代码,因为文件经常包含短小的每个功能的腻子膏。

  所以一个巨大的HTML 5的腻子膏库是很好的,但更好的是我所谓的html-5-polyfill-o-matic,一组允许我通过bog标准HTML+JS写Web组件,通过静态分析或运行时的Object.observe分析完我的代码后,它为我的项目产生一个精确的完整的HTML 5 腻子膏子集。

  当我开始试着混合和匹配多个资源的Web组件和库时,这类功能将会更为重要,比如一个X-Tag的<x-foo>和Polymer的<core-bar>,这意味着我要include这两个腻子膏库?(结果是不用)我到底该怎样做才能得到这些定制元素?X-Tag和Brick都有定制捆绑生成器:

  • Brick下载
  • X-Tag下载

  如果我开始创建定制元素,我需要创建我自己的定制捆绑吗?我不认为那是个可扩展的想法,我相信我们需要习语和工具来处理这些是更好的办法。这可能实际上意味着改变我们怎样打开资源;一个“小部件”不是个项目,所以我们处理这些事情的方法要改变。的确,还是要把代码放进Git,但你需要负担一个GitHub项目吗?如果有个东西比现在项目更小、更接近Gist是更合适的。我如何为我的项目最小化/硬化所有这些代码成正确的格式?如同Asset Graph的东西可能是个很好的开始。

  那么我们现在需要什么?

  1、建立可重复使用的组件的习语和指导。

  2、在这些习语下编译、崩溃、运行等的工具,所有HTML、CSS和JS。

  3、一个可扩展的HTML 5腻子膏(polyfill),基于实际使用的全部或按比例缩小的。

  这就是创建一个不需要学习最新的框架的最新模型的未来我们需要的,取而代之的,我们只直接与平台工作,拉入定制元素和库来满足特定需求,消耗时间创建应用,而不是标记冰山。

 问答

  问:为什么你讨厌框架的作者。

  答:我不讨厌他们。我的一些最好的朋友也是框架作者。我承认有点灵感来自于你们已经毁了Javascript,开玩笑啦,但是,再一次重申,没有嘲笑框架作者的意思。

  问:在HTML 5里你不能做XXX,为了这个,你需要个框架。

  答:首先,这不是个问题。第二,感谢指出这个事情。现在我们一起将这个完善起来,HTML 5 允许在没有框架的情况下完成XXX。

  问:但是XXX不是个框架,是个库!

  答:是的,正如我说的,它是个有梯度的代码,从主旨到框架,你可能会画下一条与我的稍有不同的界限。这是可以的,这不是关于某一种特定软件的分类,是关于从框架中挪走。

  问:我已经用了XXX和XXX很多年了。

  答:再说一次,这不是个问题,但是无所谓了,这是对你好啊,你应该以良好的状态来帮助别人。

  问:所以每个人都需要重写下拉菜单、表格、滑块和触发?

  答:绝对不用,要点是有一种方法来创建这些元素,一种不用买一种特定框架的方法。

  问:哥们,所有那些HTML导入都会降低我的站点的性能。

  答:是的,如果你很天真的使用这些东西,它会的,这就是我为什么提到需要一个HTML、CSS和JS的编译和崩溃的工具。

  问:那么不建议我使用任何库?

  答:不是的,这不是我说的,我很仔细的描绘了库和框架的分界线,一个库提供可供其他库使用的功能的正交。库是可以用的,不过框架是我希望看见大家不再使用的。

  问:但是我喜欢数据绑定!

  答:许多人都喜欢,我只是表达一下我自己个人的喜好。我并没有说你不应该使用数据绑定,但是你不需要使用一整个框架来获得数据绑定,有单独的库来做这个。

  原文:No more JS Frameworks byJoe Gregorio 翻译:postd_cn

不要再使用JS框架了相关推荐

  1. 13 款惊艳的 Node.js 框架——第1部分

    2019独角兽企业重金招聘Python工程师标准>>> [编者按]本文作者为 Peter Wayner,主要介绍13款至精至简的 Node.js 框架,帮助你简化高速网站.丰富 AP ...

  2. js 获得明天0点时间戳_Python 3+Django 3 结合Vue.js框架构建前后端分离Web开发平台实战...

    点击上方"测试开发技术",选择设为"设为星标" 优质文章,第一时间送达! 学习全文大概需要 12分钟,内容实战性较强. 1. 前言 本篇将基于Python 3. ...

  3. 基于 Egg.js 框架的 Node.js 服务构建之用户管理设计

    转载需经本人同意且标注本文原始地址:https://zhaomenghuan.github.io/blog/nodejs-eggjs-usersytem.html 前言 近来公司需要构建一套 EMM( ...

  4. 本地存储和移动端js框架及bootstrap简介

    本地存储和移动端js框架 文章目录 本地存储和移动端js框架 一.本地存储 1.cookie 2.localStorage 3.sessionStorage 二.jquery UI 三.移动端js事件 ...

  5. Node.js 框架设计及企业 Node.js 基础建设相关讨论

    大家好,我是若川.19年我写的 lodash源码 文章投稿到海镜大神知乎专栏竟然通过了,后来20年海镜大神还star了我的博客,同时还转发了我的微博.时间真快啊.今天分享这篇Node.js的讨论. 2 ...

  6. 八款Js框架介绍及比较~转载

    Js框架介绍 目前来看,JS框架以及一些开发包和库类有如下几个,Dojo .Scriptaculous .Prototype .yui-ext .Jquery .Mochikit.mootools . ...

  7. 八款JS框架介绍及比较

    Dojo      Dojo 是目前最为强大的JS框架,它在自己的 Wiki 上给自己下了一个定义,Dojo 是一个用 JavaScript 编写的开源的DHTML工具箱.Dojo 很想做一个&quo ...

  8. 数据可视化js框架 d3.js入门

    数据可视化js框架 d3.js入门 [一] 选择元素绑定数据 1.下载.引入d3.js 2.d3.select():选择所有指定元素的第一个 3.d3.selectAll() :选择指定元素的全部 e ...

  9. Vue.js框架简介(1)

    1.Vue.js框架简介 Vue(读音 /vju:/,发音类似于 view)是一套用于构建用户界面的渐进式的JavaScript框架. 1.1.为什么要学习Vue.js 什么是Vue.js Vue.j ...

最新文章

  1. 钻进眼球的致盲寄生虫威胁近亿人,却只是生存竞争的失败者
  2. UI设计 - 首页(主页)的任务
  3. 【转】HTTP Header 详解
  4. 腾讯html5平台,腾讯浏览服务
  5. [转]The Top 10 Attributes of a Great Programmer
  6. [补档]noip2019集训测试赛(十)
  7. 强命名保护DLL文件
  8. 网易游戏回应裁员 10%;字节跳动秘密研发手机;iOS 13 beta 5 发布 | 极客头条
  9. model中的数据如何显示在html上,django – 使用DRF ModelViewSet和TemplateHTMLRenderer时如何访问模板中的数据?...
  10. vue slot的使用介绍
  11. 2015年总结与2016年目标
  12. 苹方字体 for linux,苹果苹方字体/苹方黑体全套完整版下载(ttf版)
  13. 用ln命令链接文件 --- 一根绳子上的蚂蚱?
  14. 存量房贷利率,一种简单估算其自然年利率调整的方法。
  15. C#:使用Spire.xls写Excel数据
  16. Swin Transformer全方位解读【ICCV2021马尔奖】
  17. java往字符串数组追加新数据
  18. CRM销售系统价格 CRM销售管理系统需要多少钱
  19. C语言趣味问题系列【1】 猜牌术
  20. 疯狂的大柚柚带你玩转MSP-ESP430G2(基础篇) -----(四)ESP430G2 低功耗模式

热门文章

  1. 算法(一):二分查找法
  2. vs2013 提交 github
  3. AndroidStudio_android使用自己封装的消息队列处理问题_封装LinkedQueue---Android原生开发工作笔记242
  4. STM32工作笔记0068---SPI同步通信Flash读写实验
  5. DataBseDesign工作笔记004---PowerDesigner导入sql脚本生成物理模型
  6. 全局变量链接时的冲突
  7. 基于BS模式的航材电子商务交易平台(2)
  8. 杭电1874畅通工程续
  9. mysql 表字段部分替换
  10. Xcode增加头文件搜索路径的方法