作家
登录

现代前端开发技术栈

作者: 来源: 2017-07-26 15:16:53 阅读 我要评论

首图

这篇文┞仿将会介绍以前几年 JavaScript 开辟方面的概绫屈性成长。

比来几年,应用开辟的办法论产生了翻禀赋地的变更。跟着微办事架构、云计算、单页应用和响应式设计的鼓起和成长,在包管项目开辟进度、用户体验和应用机能的同时,开辟者须要做大年夜量的决定计划。如今,对于前端开辟和 JavaScript 更是如斯。

为了赞助大年夜家跟上节拍,我们先来简单懂得下比来几年 JavaScript 开辟方面的概绫屈性成长。然后,我们会懂得下前端开辟社区所面对的一些挑衅和机会。

JavaScript 的技艺中兴

2009 年 NodeJS 横空出世时,它已经不仅仅是可以在敕令行中运行或在 server 端运行的 JavaScript 了。NodeJS 环绕焦急切须要解决的软件开辟方面的问题做出了概绫屈性供献:针对于前端开辟者的成熟稳定的生态体系。恰是因为 Node 和它默认的担保理器 npm 的存在,在应用开辟和应用构建方面,JavaScript 鼓起了一场技艺中兴。生态体系繁华起来了,然则因为当时 Nodejs 还很年青,所以经常会出问题。

让人欣慰的是,以前几年代码模式和代码规范达到了巅峰。2015 年,JavaScript 社区见证了 ES2015 的宣布,生态体系再一次爆发式繁华。下面的描述仅仅展示了 JavaScript 生态体系中最风行的一部分。

2017 年 JavaScript 生态系同一览

在 Kenzan,我们在多种平台上——大年夜浏览器到机顶盒——应用 JavaScript 开辟了十多年。我们目睹了前端生态体系的成长、成长,拥抱社区所付出的所有积极的尽力。大年夜 Grunt™ 到 Gulp,大年夜 jQuery® 到 AngularJS,大年夜复制脚本到应用 Bower 来治理前端依附,这些我们都经历过了。

JavaScript 日渐成熟,我们的开辟流程也是如斯。在为客户端开辟设计优雅、机能稳定、成熟的软件应用时,我们意识到结实的本地开辟工作流和技巧栈是我们成功的基石。在开辟过程中对靠得住性、成熟性和高效性的寻求让我们感触感染到全部开辟情况不仅仅是一套对象的聚积,相反,好的开辟情况有助于最终产品的成功。

挑衅和机会

在 Kenzan,我们的经验使我们可以或许定义和整合一些关键的概念和理论,以确保我们的决定计划有助于解决我们在开辟前端软件时所预感到的挑衅:

  • 供给一个稳定成熟的、低到无需保护的(即,开辟人员不须要安装或保护全局的开辟依附,且具有直不雅的工作流/义务流)本地开辟情况。

  • 应用担保理器来治理前端构建依附。

  • 安排优化过的、基于功能特点的 bundles(已经打包了HTML、CSS和JS),为用户供给更智能、更快速的分发和下载。结合 HTTP/2,可以获得小投入大年夜产出的效不雅,可以大年夜大年夜进步用户体验和产品机能。

新的技巧栈

在工程开辟周期,一味寻求最新的对象和技巧会制约开辟速度,阻碍重大年夜里程碑的实现,带来推迟上市和客户流掉的风险。在必定程度上,一个团队须要眉僮霸己的问题汉孟耋,然后大年夜可选的筹划中做出决定计划,认清利弊,如许才可以更好地猜测产品的经久可行性和可保护性。

在这篇系列里,我们的存眷点是前端开起身术栈的三个部分。对于每个部分,我们将懂得下我们认为可以或许为现代 JavaScript 应用法度榜样开辟的靠得住性、高效性和可保护性供给最佳均衡的对象。

担保理器:Yarn

若何故靠得住和持续重现的方法治理和安装外部 vendor 或内部包的挑衅,对于开辟者的工作流来说是至关重要的。同时,保护 CI/CD(持续集成/持续交付)也是至关重要的。然则,钠揭捉?择哪个担保理器来评估上述所有的功能呢?npm?jspm?Bower?CDN?或者说你只是大年夜网上复制粘贴,然后提交到版本控制器上?

伴跟着如斯多的选择、如斯繁华的生态体系,社区将何去何大年夜?尽管有选择是件功德情,然则对于社区来说,肯定大年夜何开端、须要什么和为什么须如果有些艰苦的。跟着用户期望的增长,应用法度榜样应当若何运行和表示(加载速度更快,运行更顺畅,响应式,可以和原生应用媲美等等),在开辟团队的临盆力需乞降该项目可以或许在预期市场上推出场取获成功之间求取均衡,变得越来越具有挑衅性。针对于此,甚至有一个名为分析导致瘫痪(analysis paralysis)的术语:因为过于思虑和不须要地使问题复杂化使得做决定计划变成了一个难题。

我们的第一篇文┞仿将会简单地懂得下 Yarn,懂得下它是若何专注于速度和供给稳定的构建流程的。Yarn 包管此次安装的依附的版本和下次安装的依附的版本是完全一致的。包管全部过程腻滑、靠得住、分布式和范围化是必须的,因为任何逗留都邑影响到开辟者编程或安排应用的节拍。Yarn 旨在经由过程为 npm cli 供给快速靠得住的替代筹划来解决这些问题、治理依附,然则依然持续应用 npm registry 来安装公共 Node 包。并且,Yarn 是由 Facebook 来保护的,他们在开辟这个对象的时刻是有所筹划的。

应用打包:webpack™

我们构建的前端应用法度榜样,平日是由 HTML、CSS 和 JS 以及图像和字体等二进制格局构成的,可能难以保护,甚至会更具挑衅性。那么,若何将一个代码库转换为一个优化过的、可安排的项目?Gulp?Grunt?Browerify?Rollup?Systemjs?这些器械都各有优缺点,然则我们须要确保我们的选择可以或许实现我们上述评论辩论过的那些原则。

Webpack 是一个专门将 web 应用打包构建为一个优化过的载体传递给用户而打造的一款构建对象,web 应用可能会包含 HTML、CSS、JS、图片、字体等等。如不雅我们想应用最新的说话特点,比如 import/export 和 class,来使我们的代码更整洁,让对象来打包代码,使其对浏览器和用户都进行优化,那么 Webpack 可以做到这些,并且还可以做的更多!


  推荐阅读

  Linux:终端提示符 (prompt) 不如期生效原因

媒介先来简单介绍下, prompt是什么鬼? 顾名思义就是提示符的意思, 看起来和我们遥远, 但实际上只如果每个接触shell的童鞋, 都有看到, 那就是我们在输敕令时前面的那串提示符.例如:当然, >>>详细阅读


本文标题:现代前端开发技术栈

地址:http://www.17bianji.com/lsqh/36416.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)