当前位置: 首页 > 科技观察

2017年前端开发工具流行趋势

时间:2023-03-19 20:18:07 科技观察

你有两年以上的前端开发经验吗?会不会使用Sass、Autoprefixer等高级CSS辅助技能?你对JavaScript有很好的了解吗?你喜欢使用Gulp、npm和jQuery吗?如果是这样,根据AshleyNolan的前端调查,您就是典型的前端开发人员。01谎言,该死的谎言,统计和问卷谎言,该死的谎言,统计(英语:Lies,damnedlies,andstatistics)是西方一句著名的谚语。主要描述数字的说服力,尤其用来讽刺没有说服力的统计数据支持的分析报告,以及人们倾向于贬低不支持自己立场的统计结论。像维基百科这样的调查可以帮助您发现新工具和知识差距。在撰写本文时,该调查收到了5,254份回复,这比大多数民意调查的样本值更大。不过,调查结果是否代表事实仍需谨慎。..全球统计结果该调查是全球性的,但主要来自英语国家。其他地方开发或使用的流行工具可能会被忽略。开发者知识本次调查需要对调查问题有深刻理解并有时间和兴趣完成调查的有经验的开发者。83%的受访者有两年或以上的前端技术经验,只有5%的前端经验不到一年:前端技能较低的开发人员完成此调查的可能性较小,因此结果可能会出现偏差因此。意见和偏见要求受访者判断自己的水平。有些人可能比较谦虚,有些人则有困难选择综合症。有些人可能高估了自己的水平,因为他们可能是一群新手程序员中唯一的前端开发人员。自我偏见的偏见可以被平均掉,但没有办法证明。过去的行为不是未来的趋势调查结果突出了开发人员已经在使用的工具。这并不意味着这些工具有用、节省时间或将在未来的项目中使用。02CSS63%的开发人员将自己的CSS知识评为高级或专家:虽然CSS是一个看似简单的属性和值的键值集合,但众所周知,CSS很难掌握。CSS3引入了许多新效果,要了解所有这些效果变得越来越困难。例如,我对新的CSSGrid模块知之甚少,而在开发Flexbox布局时,我经常不得不翻阅手册(或随机试验各种属性和值)!10%的受访者承认只有不到一年的开发经验,但声称拥有高级CSS知识!我怀疑他们很快就会意识到,他们知道的越多,不知道的就越多!超过63%的受访者使用CSS预处理器Sass-无可争议的预处理器冠军。8%的受访者也使用PostCSS,尽管它经常与其他预处理器结合使用以提供有用的功能——例如AutoPrefixer(65%的受访者使用)。近14%的受访者不使用预处理器,更喜欢使用原始CSS代码。当您认为这是开始前端开发的最简单(也是最安全)的方式时,这个百分比似乎有点低。如果86%的开发人员使用CSS预处理器,我希望每个网站的平均CSS文件请求少于7.2。近70%的受访者尝试过Less,19%的人尝试过Stylus。80%的人从未听说过返工。CSS命名方案46%的受访开发人员使用命名方案,但对于自评CSS水平为高级或专家的开发人员,这一比例上升到57%。首选是BEM,占40%,其次是CSSModules(16%)、OOCSS(15%)和SMACSS(13%)。其他CSS工具Modernizr目前在39%的项目中使用。这可能看起来令人惊讶,因为它的主要目的是与大部分已弃用的旧版IE兼容。(微软于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%的项目使用Angular1,尽管只有8%的项目认为它不可替代。Angular2相对被排除在外,刚好超过8%。大多数项目中只有3%使用它。Vue.js已被10%的项目采用,但只有不到6%的开发人员对该框架感到满意,3%的开发人员认为有必要。对于明年的调查,这个问题可能会有用:“您是否放弃了项目中的框架或更换了框架?”尽管有大量的JavaScript专家,但只有21%的人认为框架不是必需的并且乐于编写本机代码。这是一个令人担忧的数据吗?30%的开发人员认为他们的框架抽象技能集可以满足他们的所有需求吗?任务执行器和模块打包工具Gulp是最大的赢家,接近44%的开发者在使用。然而,更简单的npm脚本在2016年增加了23%到26%。Grunt已经失去了优势,下降到12%。此外,9%的受访者选择不使用任务运行器。2016年,使用模块打包器的人数增加了20%至68%。Webpack最受欢迎,占31%,Browserify占11%,RequireJS占8%。令我惊讶的是,“其他”模块打包器所占比例不到4%,而有几个任务运行器插件可以更轻松地进行依赖管理,例如gulp-deporder。也许是因为每个开发人员都在使用JavaScript转译器...ES6到ES5转译器62%的开发人员正在使用Babel等工具将干净的ES6代码转译为旧浏览器支持的ES5代码。31%的人听说过Possibility,但没有使用过该工具,7%的人从未听说过这个词。这个数字似乎相当高。InternetExplorer和较旧的应用程序不支持最新的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。042017年你应该用什么?有关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社区如何看待哪些工具集,这些知识都会受用一生。也许有一天,你甚至会写出一个高大上的工具,成为各种框架的一员。感谢AshleyNolan对前端工具的调查和结果分析。