文档章节

2017年前端开发工具趋势

网页设计轻松学
 网页设计轻松学
发布于 2017/06/30 07:31
字数 2660
阅读 44
收藏 0

你有两年以上的前端开发经验吗?你会用 Sass 和 Autoprefixer 等高级的CSS辅助技能吗?你的 JavaScript 知识是否融汇贯通,你是否喜欢使用 Gulp , npm 和 jQuery ?如果是这样,根据 Ashley Nolan 的前端问卷调查,你是一个典型的前端开发工程师。

01谎言,该死的谎言,统计数字和调查问卷

谎言,该死的谎言,统计数字(英文:Lies, damned lies, and statistics),是一句著名的西方谚语。主要描述数字的说服能力,特别是用来讽刺一些使用统计数字支持、但毫无说服力的分析报告,以及人们倾向于贬低那些不支持其立场的统计结论。 维基百科

诸如此类的调查有助于你发现新工具和你的知识短板。至本文撰写时,本次问卷调查收到了5,254份答复,这是比大多数民意调查更具有样本价值。但是,调研结果是否代表真相还是应该抱审慎态度。。。

全球性的统计结果

这次问卷调查是全球性的,但将主要来自英语国家。 在其他地方开发或使用的流行工具可能被忽略。

开发人员知识

本次问卷调查呼吁经验丰富的开发人员对调研问题有深刻理解并且有时间,有兴趣去完成本次调查。

83% 的受访者有两年或两年以上的前端技术经验,只有 5% 的受访者不到一年前端经验:

具备较低前端技能的开发人员不太可能完成本次问卷调查,因此结果可能会相应偏离。

意见和偏见

受访者被要求判断自己的水平。有些人可能比较谦虚,有些有选择困难综合症。有些人可能高估了自己的水平,因为他们可能是一群新手程序员团队中唯一前端开发人员。自我偏见的偏差可以被平均,但没有办法证明。

过去的行为不代表未来的趋势

调查结果突显了开发人员已经使用的工具。这并不意味着这些工具是有用的,可以节省时间或将在将来的项目中使用。

02CSS

63%的开发人员将他们自己的CSS知识评为高级或专家水平:

虽然 CSS 是一个看似简单的 属性 和 值 的键值对集合,但是 CSS 是众所周知地难以掌握。 CSS3引入了一系列新效果,并且越来越难以掌握所有的知道。例如,我对新的 CSS网格模块 知之甚少,还有当开发 Flexbox 布局时常常需要翻阅手册(或随机尝试性的使用各种属性和值)!

10%的受访者承认不到一年的开发经验,却声称已经掌握高级的CSS知识!我怀疑他们很快就会意识到,懂的越多,意味着不懂的也就越多!

CSS 预处理器

超过 63% 的受访者使用 Sass – 无可争议的预处理器冠军。8%的受访者还使用 PostCSS,虽然它通常与其他预处理器结合使用以提供有用的功能 – 如AutoPrefixer( 65% 的受访者采用)。

近 14% 的受访者不使用预处理器,而更喜欢使用原始 CSS 代码。当你认为它是最简单的(和最好的)开始前端开发的方式时,这个比例似乎有点低。如果 86% 的开发人员使用 CSS 预处理器,我预计平均每个网站的CSS文件请求应该低于7.2个。

近 70% 的受访者尝试过 Less ,19% 的受访者尝试了 Stylus 。80% 从未听说过 Rework。

CSS 命名方案

46% 的受访开发人员使用命名方案,但是对于那些将 CSS 水平自我评价为高级或专家级别的人来说,这一比例上升到 57% 。

最受欢迎的选择是 BEM ,占40%,其次是 CSS模块(CSS Modules)(16%),OOCSS(15%)和 SMACSS(13%)。

其它CSS工具

当前 39% 的项目中正在使用 Modernizr 。这似乎令人惊讶,因为它的主要用途是兼容大部分已经被弃用的旧版本IE。(Microsoft已于2016年1月停止支持IE10及以下版本。)

14% 的受访者使用 Stylelint 来检查CSS有效性。这似乎很低,但最流行的IDE和编辑器有一些类似的 CSS 检查,所以可能没有必要。

23% 的开发人员不使用任何CSS工具或命名方案。

03JavaScript

如果你认为 CSS 的各种工具已经很混乱了,欢迎来到迷人的 JavaScript 世界!

JavaScript 开发人员比较谦虚,51% 的受访者认为自己的JavaScript 知识达到了高级或专家水平:

库和框架

尽管有相关性的质疑,超过 99% 的开发人员在某些时候使用 jQuery,并且 31% 的受访者认为对很多项目来说 jQuery 是必要的。70% 的受访者在当前项目中继续使用 jQuery ,这与 W3Techs 观察到的数据相似:

框架情况更令人困惑:

已有 38% 的现有项目采用了React。然而,只有 29% 的开发人员使用它感到舒适,18% 的受访者认为它是必要的。只有0.1%的网站被发现正在使用React,但请记住,调查结果是从前端开发人员收集的 – 而不是所有的Web开发人员。 有 25% 的项目使用 Angular 1,虽然只有8%的人认为它是不可替代。Angular 2则相对受冷落,只比8%多一点。只有3%的人在多数项目中使用它。 Vue.js 已经被 10% 的项目采用,但少于 6% 的开发人员对框架感到舒适,3% 认为它是必要的。

对于明年的问卷调查,这个问题可能有用:“你是否放弃了一个框架或者在项目中切换框架?

尽管有大量的JavaScript专家,只有 21% 的人认为框架不是必须的,并乐意编写原生代码。这是一个令人担忧的统计数据吗?30% 的开发人员认为他们的框架抽象技能集可以满足他们的全部需求?

任务执行器和模块打包工具

Gulp是最大的赢家,接近 44% 的开发人员在使用。然而,更简单的 npm scripts 脚本在2016年增加了 23% ,达到 26% 。

Grunt 已经失去了优势,跌落到 12%。另外,9% 的受访者选择了不使用任务运行器。

那些使用模块打包工具在2016年增加了 20%,达到 68% 。 Webpack 是最为流行,占 31% ,Browserify 为 11% ,RequireJS 为 8% 。

我很惊讶,“其他”模块打包工具占不到 4%,当有几个任务运行器插件可以更简单的管理依赖关系,例如 gulp-deporder 。也许因为每个开发人员都在使用JavaScript 转译器…

ES6到ES5的转译器 (transpilers)

62% 的开发人员正在使用诸如 Babel 之类的工具,将简洁的 ES6 代码转换为旧版浏览器支持的 ES5 代码。 31% 的人听说过可能性,但没有使用工具,和 7% 从未听说过这个词。

这个数字似乎相当高。Internet Explorer 和老的应用程序不支持最新的 JavaScript 语法,但是如果您要编写 ES6 代码,为什么还要支持他们呢? 如果你确实需要支持 IE11 及以下版本,编写 ES5 代码不是更容易吗?

其他JavaScript工具

41%的开发人员使用 ESLint , 19% 使用 JSLint 和 14% 使用 JSHint 来检查他们的代码的有效性 – 例如缺少括号,省略分号,格式缩进等。

23%的受访者不使用代码检查工具 – 虽然,也有可能他们依靠他们的文本编辑器或 IDE 来发现最严重的语法错误。

使用测试工具的用户在一年中增长了 12% ,达到了 52% 。 历史上,JavaScript 测试一直是一个挑战。

诸如测试驱动开发(TDD)等技术可以捕获逻辑问题,但不能解决异步事件遇到的问题,例如当 UI 在特定浏览器中执行某种意外操作时。

幸运的是,行为驱动开发(BDD)的可能性已经出现,以检查在真实的浏览器中的活动,并使前端测试更具可行性。 最流行的系统有:

Mocha – TDD/BDD (23%) Jasmine – BDD (17%) QUnit – TDD (4%) Jest – TDD/BDD (3%) Ava – TDD/BDD (2%)

最后,有 94% 的受访者使用 npm – Node.js 的包管理器。出乎意料,有 32% 曾经使用过 TypeScript 。

04你在2017年应该使用什么?

关于 CSS,Sass 的知识,PostCSS 和 BEM 很明显是必要的。也就是说,开发的多样性很广。我建议你研究一些预处理器和命名方案,以便了解每个工具可以实现什么 – 即使是你选择不使用它们。

JavaScript 方面的工具不太好说。有一些明显的特征和趋势:

Node.js 和 npm 将变得至关重要,因为你采用的工具记得上都是 Node.js 和 npm 实现管理的。 Gulp 和/或 Webpack 也值得尝试一下。 了解ES6,即使您仍然在向后兼容的 ES5 项目上工作。

我从不羡慕那些尝试为新项目选用类库或框架的人。从调研结果来看,jQuery是明显是最受欢迎的。然而随着 IE 的消亡,jQuery 的跨浏览器支持变得没那么重要,并且许多功能已经和浏览器原生 API 和 CSS 重复。

你可以选择一个框架,如 React,因为它很受欢迎 – 但这并不代表它就适用于你的应用。即使 React 将最终被更好,更优秀的东西取代。

我的建议:从众多框架中挑选某一个之前,先学习HTML,CSS,JavaScript 和浏览器开发的基础知识。无论 JavaScript 社区如何评价哪些工具集,这些知识将终生受用。也许有一天,你甚至会编写出一个高大上的工具,也成为各种框架中的一员。

感谢 Ashley Nolan 的前端工具调查和结果分析。

英文:Craig Buckler 译文:愚人码头

http://www.aishufang.cn/ 文章来源网络,如有侵权请联系小编

喜欢的可以加Q群162542073一起讨论,交流

输入图片说明

本文转载自:

网页设计轻松学
粉丝 0
博文 56
码字总数 5298
作品 0
朝阳
程序员
私信 提问
2017年Web前端必火的6大流行开发趋势!

Web前端流行开发趋势 每到年底,人们总喜欢展望下一年,Web 开发领域也不例外。在 Web 开发领域,技术革新的速度堪比光速,未来总是超乎我们的想象,我们只能尽自己所能做一些合理的预测。 ...

qq58fec62e6d53b
2017/04/25
0
0
2018前端值得关注的几个趋势

1.前言 2017悄然过去,2018已经来到。人在进步,技术在发展。2018年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。下面就我个人的判断进行一个预测判断,希望能对大家起到...

2018/01/08
0
0
2019小程序发展的趋势,专业提供小程序系统开发解决方案

2019小程序发展的趋势,专业提供小程序系统开发解决方案 【本文由汇新云李先生编辑/小程序系统开发搜索微信:huixinyunit】 2017年1月9日,小程序正式上线,一年后,小程序却在不知不觉中变成...

软件定制_汇新云
05/27
0
0
JavaScript 年度调查报告:React、Vue 和 Angular 三分天下,谁将在 201

JavaScript 年度调查报告:React、Vue 和 Angular 三分天下,谁将在 201 程序师2017-12-290 阅读 javascript业界观察 要论 2017年最主流的三个 Web前端框架,应莫过于 Angular、Vue和 React了...

程序师
2017/12/29
0
0
2017年IT人年终总结,一个都不知道的你这一年就白过了

移动互联时代,每天都会涌现大量新词热词,我们IT圈也不例外,2017年就要过去了,是时候来回顾下这一年都发生了什么 首先来看看2017年互联网的热词与流行语,原来2017年的年轻人们聊天最经常...

uzv80px5v412ne
2017/12/30
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Blockstack-2 :Blockstack ID注册

本篇文章主要记录Blockstack ID注册的流程; 在介绍注册流程之前,先简单的介绍一下Blockstack ID; 相对于传统互联网来说,Blockstack ID更像是统一的账号系统;即一个账号即可登录和授权所...

Riverzhou
44分钟前
11
0
面试官问:平时碰到系统CPU飙高和频繁GC,你会怎么排查?

处理过线上问题的同学基本上都会遇到系统突然运行缓慢,CPU 100%,以及Full GC次数过多的问题。当然,这些问题的最终导致的直观现象就是系统运行缓慢,并且有大量的报警。本文主要针对系统运...

Java高级架构师n
今天
24
0
面向对象编程

1、类和对象 类是对象的蓝图和模板,而对象是实例;即对象是具体的实例,类是一个抽象的模板 当我们把一大堆拥有共同特征的对象的静态特征(属性)和动态特征(行为)都抽取出来后,就可以定...

huijue
今天
25
0
redis异常解决 :idea启动本地redis出现 jedis.exceptions.JedisDataException: NOAUTH Authentication required

第一次安装在本地redis服务,试试跑项目,结果却出现nested exception is redis.clients.jedis.exceptions.JedisDataException: NOAUTH Authentication required错误,真是让人头疼 先检查一...

青慕
今天
35
0
Spring 之 IoC 源码分析 (基于注解方式)

一、 IoC 理论 IoC 全称为 Inversion of Control,翻译为 “控制反转”,它还有一个别名为 DI(Dependency Injection),即依赖注入。 二、IoC方式 Spring为IoC提供了2种方式,一种是基于xml...

星爵22
今天
36
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部