优秀的前端需要做到什么

北京治疗白癜风大概要多少钱 http://pf.39.net/bdfyy/bdfjc/150526/4629689.html

在知乎上看到一篇文章,大概的意思是互联网行业不是真的缺会做前端的,缺的是优秀的前端。

下面是文章中提到的一些点,放在这里以自省:

事实上,前端工程师在做的是:

在设计师和工程师之间创建可视化的语言;用可视化的设计,定义一组代表内容、品牌和功能的组件;为Web应用程序的公约、框架、需求、可视化的语言和规格设定底线;定义Web应用程序的设备、浏览器、屏幕、动画的范围;开发一个质量保证指南来确保品牌忠诚度、代码质量、产品标准;为Web应用程序设定适当的行距、字体、标题、图标、边距、填充等等;为Web应用程序设定多种分辨率的图像,设备为主的实体模型,同时维护设计指南;用accountsemantics,accessibility,SEO,schemas,microformats标记Web应用程序;

用一种友好的,消耗小的,设备和客户端感知的方式连接API,获取内容;开发客户端代码来显示流畅的动画、过渡、延迟加载、交互、应用工作流程,大多数时间用来考虑渐进增强和向后兼容的标准;保证后台连接安全,采取跨地资源共享(CORS)的程序考虑,防止跨站点脚本(XSS)和跨站点请求伪造(CSRF);最重要的是,尽管有严格的期限、利益相关者的要求,以及设备的限制,无论现在还是将来永远是「客户第一」。

为了实现上述目标,前端工程师采用了从可视化到编程的多种工具,甚至有时要照顾市场、UX到内容等等。

糟糕的前端工程师:

JavaScript类库乱用,对JavaScript本身并不了解,什么地方都用jQuery;滥用JavaScript插件,看都不看看就把别人的代码拿过来用,比如说;不看需求,不做任何的比较和测试,就把CSS框架加到项目中,但只用了其中5%的功能;认为添加个CSSFramework,网站就可以变成“响应式的”,或者响应式就像是一些小作料,随便就可以加入到一个网页应用中;嘴上喊着“响应式的Web设计”,但服务端技术一点都不懂;编写的CSS没有任何规范标准,不使用任何预处理器,也没有最佳实践。CSS代码中充满了过度使用的选择器、ID、神奇的数字以及!important;不关心代码的性能和内存泄露(什么是真正的内存泄露也不清楚),不会对代码进行性能测试;对产品没有任何的衡量指标,或者把“在我的电脑/浏览器/移动设备上可以工作”为指标;忽视30年的软件工程实践,毫无章法的开发软件。

要知道,入门容易精通难,计算机和软件的基础对你用JS或浏览器编程都非常重要。web可能是最有影响力的平台和环境之一,在那里执行的程序必须被小心对待。

一位优秀的前端工程师不仅要考虑web技术和语言,并且还要了解所有不同的组件、系统和概念。

顶级前端工程师需要具备的经验和最佳实践(这才是市场急需的前端):

了解DNS解析,充分利用CDN,使用多个域名来完成资源的请求以缩短加载时间;设置HTTPHeaders(Expires,Cache-Control,If-Modified-Since);遵循SteveSouders给出的全部规则(HighPerformanceWebsites)知道如何解决PageSpeed、YSlow、ChromeDevToolsAudit、ChromeDevToolsTimeline显示的所有问题;知道什么任务该放在服务端,什么任务该放在客户端;知道使用缓存,DNS预取和资源预加载技巧;精通JavaScript,知道何时自己写何时借组别人的框架或代码,优劣明辨;熟练使用现代MVCJavaScript框架(例如AngularJSEmberJSReact等),图形库(D3、SnapSVG等),DOM操作类库(jQuery、Zepto等),惰性加载或者模块管理类库(例如RequireJS、CommonJS等),任务调用工具(例如GruntGulp等),包管理工具(BowerComponentjs)以及测试工具(Protractor、Selenium等);掌握图片的格式,每种格式的优点,适用的场景;知道图片优化技巧以及加载策略(雪碧图、懒加载、缓存刷新以及PNG交错);熟悉CSS标准、最新的转换工具积极策略规范(比如BEM、SMACSS、OOCSS等);JavaScript的计算机科学(内存管理、单进程特性、垃圾回收算法、定时器、作用域、提升以及设计模式)。

换句话说,如果说精通HTML+CSS+JS,了解后端知识,只是60分的合格前端;那么要想成为受追捧、拿高薪的80分优秀前端,要对业务需求和、架构设计有真正的运用;而分的顶级前端,则必须要能够兼顾技术和设计,更接近「以前端开发为主的全栈工程师」了。




转载请注明:http://www.aierlanlan.com/rzfs/5128.html

  • 上一篇文章:
  •   
  • 下一篇文章: 没有了