1. 首页
  2. IT资讯

属于你从来没见过的2018年前端开发工具的趋势

“u003Cdivu003Eu003Cpu003Eu003Cspanu003E你有两年以上的前端开发经验吗?你会用 Sass 和 Autoprefixer 等高级的CSS辅助技能吗?你的 JavaScript 知识是否融汇贯通,你是否喜欢使用 Gulp , npm 和 jQuery ?如果是这样,根据 Ashley Nolan 的前端问卷调查,你是一个典型的前端开发工程师。u003Cu002Fspanu003Eu003Cbru003Eu003Cu002Fpu003Eu003Cpu003Ecss指层叠样式表(cascading style sheets),主要用于设置HTML页面中的文本内容(字体、大小、对齐方式的等)、图片的外形(宽高、边框样式、边距等)以及版面的布局等外观显示样式。u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F152542271952226ee6e6069″ img_width=”1023″ img_height=”730″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E总的来说:u003Cu002Fpu003Eu003Cpu003EHTML是从语义的角度搭建页面结构,u003Cu002Fpu003Eu003Cpu003Ecss负责从审美的角度美化页面,u003Cu002Fpu003Eu003Cpu003Ejs则是从交互的角度提升用户体验。u003Cu002Fpu003Eu003Cpu003ECSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。u003Cu002Fpu003Eu003Cpu003E诸如此类的调查有助于你发现新工具和你的知识短板。至本文撰写时,本次问卷调查收到了5,254份答复,这是比大多数民意调查更具有样本价值。但是,调研结果是否代表真相还是应该抱审慎态度。u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F15254223766341a470dd41a” img_width=”531″ img_height=”321″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E过去的行为不代表未来的趋势u003Cu002Fpu003Eu003Cpu003E调查结果突显了开发人员已经使用的工具。这并不意味着这些工具是有用的,可以节省时间或将在将来的项目中使用。u003Cu002Fpu003Eu003Cpu003E虽然 CSS 是一个看似简单的 属性 和 值 的键值对集合,但是 CSS 是众所周知地难以掌握。 CSS3引入了一系列新效果,并且越来越难以掌握所有的知道。例如,我对新的 CSS网格模块 知之甚少,还有当开发 Flexbox 布局时常常需要翻阅手册(或随机尝试性的使用各种属性和值)!u003Cu002Fpu003Eu003Cpu003E10%的受访者承认不到一年的开发经验,却声称已经掌握高级的CSS知识!我怀疑他们很快就会意识到,懂的越多,意味着不懂的也就越多!u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F1525422376612e913f07a31″ img_width=”699″ img_height=”466″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E意见和偏见u003Cu002Fpu003Eu003Cpu003E受访者被要求判断自己的水平。有些人可能比较谦虚,有些有选择困难综合症。有些人可能高估了自己的水平,因为他们可能是一群新手程序员团队中唯一前端开发人员。自我偏见的偏差可以被平均,但没有办法证明。u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F1525422376549421ac46b4f” img_width=”450″ img_height=”253″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E其它CSS工具u003Cu002Fpu003Eu003Cpu003E当前 39% 的项目中正在使用 Modernizr 。这似乎令人惊讶,因为它的主要用途是兼容大部分已经被弃用的旧版本IE。(Microsoft已于2016年1月停止支持IE10及以下版本。)u003Cu002Fpu003Eu003Cpu003E14% 的受访者使用 Stylelint 来检查CSS有效性。这似乎很低,但最流行的IDE和编辑器有一些类似的 CSS 检查,所以可能没有必要。u003Cu002Fpu003Eu003Cpu003E23% 的开发人员不使用任何CSS工具或命名方案。u003Cu002Fpu003Eu003Cblockquoteu003Eu003Cpu003Eu003Cstrongu003E关注小编私信“学习”两字获取前端免费教程资料u003Cu002Fstrongu003Eu003Cu002Fpu003Eu003Cu002Fblockquoteu003Eu003Cpu003E03JavaScriptu003Cu002Fpu003Eu003Cpu003E如果你认为 CSS 的各种工具已经很混乱了,欢迎来到迷人的 JavaScript 世界! u003Cu002Fpu003Eu003Cpu003EJavaScript 开发人员比较谦虚,51% 的受访者认为自己的JavaScript 知识达到了高级或专家水平:u003Cu002Fpu003Eu003Cpu003E库和框架u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F1525422376697fc548663d9″ img_width=”690″ img_height=”517″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E框架情况更令人困惑:u003Cu002Fpu003Eu003Cul class=” list-paddingleft-2″u003Eu003Cliu003Eu003Cpu003E已有 38% 的现有项目采用了React。然而,只有 29% 的开发人员使用它感到舒适,18% 的受访者认为它是必要的。只有0.1%的网站被发现正在使用React,但请记住,调查结果是从前端开发人员收集的 – 而不是所有的Web开发人员。u003Cu002Fpu003Eu003Cu002Fliu003Eu003Cliu003Eu003Cpu003E有 25% 的项目使用 Angular 1,虽然只有8%的人认为它是不可替代。Angular 2则相对受冷落,只比8%多一点。只有3%的人在多数项目中使用它。u003Cu002Fpu003Eu003Cu002Fliu003Eu003Cliu003Eu003Cpu003EVue.js 已经被 10% 的项目采用,但少于 6% 的开发人员对框架感到舒适,3% 认为它是必要的。u003Cu002Fpu003Eu003Cu002Fliu003Eu003Cu002Fulu003Eu003Cpu003E对于明年的问卷调查,这个问题可能有用:“你是否放弃了一个框架或者在项目中切换框架?u003Cu002Fpu003Eu003Cpu003E尽管有大量的JavaScript专家,只有 21% 的人认为框架不是必须的,并乐意编写原生代码。这是一个令人担忧的统计数据吗?30% 的开发人员认为他们的框架抽象技能集可以满足他们的全部需求?u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp9.pstatp.comu002Flargeu002Fpgc-imageu002F1525422376694a59722ece5″ img_width=”699″ img_height=”393″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E曾经项目中遇到这样一个问题,用其他浏览器打开页面是好的,唯独是IE8打开时出奇地慢。我注意到IE8打开时慢但CPU消耗并不高,只是网页空白很久没渲染出来,可以排除JS算法上的问题。经过细心研读代码发现,有人把一部分script、 link等标签放到了u003Ccodeu003EDOCTYPEu003Cu002Fcodeu003E的前面。u003Ccodeu003EDOCTYPEu003Cu002Fcodeu003E是用来告诉浏览器解释整个文档的一套法则的,一定要放在HTML部分的最前面,先有script标签,那就意味着浏览器已经开始解释了,后面再有u003Ccodeu003EDOCTYPEu003Cu002Fcodeu003E也是没有意义的了。把u003Ccodeu003EDOCTYPEu003Cu002Fcodeu003E放到HTML部分的最前面,一开始提及的问题就解决了。u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F152542237669556e2a6edb1″ img_width=”445″ img_height=”286″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E在一个HTML DOM 树中,我要进行一个比较复杂的元素选择,不包含某些文字的带有某某类名的元素的邻居的父元素的……然后怎么做?写一个很复杂的u003Ccodeu003EjQueryu003Cu002Fcodeu003E选择器?打住。jquery选择器原理是用正则表达式去分解你的选择器字符串(这一部分叫做u003Ccodeu003ESizzleu003Cu002Fcodeu003E),然后再用内置的一些遍历函数如prev,next等(其实这些函数也是基于DOM提供的方法),去找到你想要的元素。我会不去盲目地进行Sizzle的语义歧义测试,而是自己根据自己的逻辑去用prev,next等去找到自己的元素;而且退一万步来说,我也会尽量避免使用复杂的选择器(之前的方案也有提及),单位个元素用ID,多个元素用类,绝对高效准确。u003Cu002Fpu003Eu003Cpu003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F152542237675498fdc6e53a” img_width=”350″ img_height=”265″ alt=”属于你从来没见过的2018年前端开发工具的趋势” inline=”0″u003Eu003Cu002Fpu003Eu003Cpu003E我的建议:从众多框架中挑选某一个之前,先学习HTML,CSS,JavaScript 和浏览器开发的基础知识。无论 JavaScript 社区如何评价哪些工具集,这些知识将终生受用。也许有一天,你甚至会编写出一个高大上的工具,也成为各种框架中的一员。u003Cu002Fpu003Eu003Ch1u003E关注小编私信“学习”两字获取前端免费教程资料u003Cu002Fh1u003Eu003Cu002Fdivu003E”

原文始发于:属于你从来没见过的2018年前端开发工具的趋势

主题测试文章,只做测试使用。发布者:敢吻,转转请注明出处:http://www.cxybcw.com/11422.html

联系我们

13687733322

在线咨询:点击这里给我发消息

邮件:1877088071@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息

QR code