本文首先会简单介绍Web前端开发的历史由来,以及前端开发的概念及其范畴。让读者对前端开发有个整体的认识,同时还会对前端开发的一些错误认识进行更正。本文着重于为大家介绍Web前端开发现状。
1.2Web前端开发现状
前端开发虽然起步时间晚,但是发展势头迅猛,在各种新技术、新标准的推动下,各大互联网公司也开始重视Web产品的前端重构与开发,如淘宝、腾讯、新浪、百度、搜狐等都对自己的网站进行了重构并同时使用了HTML5中的新特性。现在开发的Web新产品的页面交互也越来越丰富,视觉效果也越来越绚丽。互联网公司除了重视前端开发之外,还在积极推动互联网技术的发展,2001~2012年,腾讯、百度及奇虎360公司先后加入了万维网联盟(W3C),共同参与互联网技术标准的研究和制定,促进了国内互联网产业的发展。
在Web前端发展的过程中,浏览器的发展起着至关重要的作用。浏览器厂商在这场Web 浪潮中表现突出,具体表现在浏览器的版本升级周期短、对前端标准的支持也越来越好、浏览器的性能也有大幅的提升等。IE浏览器也开始发力,最新发布的IE10浏览器无论是标准的支持还是性能都表现突出。浏览器的快速发展使得低端的浏览器如IE6、IE7等快速退出市场。
下面看一下全球范围内浏览器的占有率情况。根据StatCounter的统计,2012年10月份,全球浏览器占
有率前5位的分别是Chrome、IE、Firefox、Safari及Opera,占有率分别
为34.77%、32.08%、22.32%、7.81%和1.63%。按照浏览器的版本统计,在低端浏览器中,IE8占有率为12%,IE7的占有率仅为0.88%,IE6的占有率则更低。
此外,移动设备上的浏览器在整个浏览器占有率中上升速度很快。根据StatCounter的统计,Safari iPad在浏览器的占有率已经达到了2.76%。目前移动设备的普及率极高,用户已经逐渐习惯于通过移动设备来浏览网页。主流的移动平台主要为Android和iOS系统,对应的浏览器都是以WebKit为核心的,性能和对标准的支持都不错。
以上介绍的是浏览器在全球范围内的占有率情况。从上面的统计可以看出,在全球范围内,低端浏览器的占有率已经很低了,但国内浏览器占有率的状况则比较复杂,低端浏览器如IE 8、IE7和IE6等还占有不小的份额。根据StatCounter的统计,2012年10月份,国内浏览器占有率前5位分别为IE8、IE9、IE6、搜狗浏览器和360安全浏览器,占有率分别为48.7%、14.09%、8.29%、5.74%和2.72%。其中低端浏览器IE8、IE7和IE6的总占有率大约为58%,低端浏览器依然占有“半壁江山”,而高级浏览器如Chrome、Safari、Firefox等占有率则很低。值得称道的是,360安全浏览器和搜狗浏览器这两款浏览器都是基于开源的浏览器内核,对标准支持较好,性能表现突出。这两款浏览器的占有率目前虽然不高,但发展势头迅猛,是推动老旧浏览器退出市场的中坚力量。
除各大互联网公司和浏览器厂商的积极推动外,Web前端开源社区的参与热情也极为高涨。在著名的网络代码托管系统GitHub上,开源的项目仍然是以前端相关项目居多,按语言排名,前3位分别为JavaScript、Ruby和Python;按项目排名,靠前的大部分也是前端项
目,如Prototype、Bootstrap、jQuery及相关插件等,具体内容可参考GitHub。国内的一些前端社区则发展较为缓慢,多是以推广HTML5为主,靠一些酷炫的效果来吸引眼球,反而关注前端基础的较少。国内Web互联网公司(如淘宝、百度、腾讯等)也有部分优秀的开源前端框架,这些公司的前端技术分享氛围不错。整体来讲,国内前端技术发展还是比较迅速的,也不乏顶级的前端技术人员,但普遍缺乏的是开放的心态和与国内外同行交流的能力,国内前端技术的发展任重道远。
Web前端整体技术的发展和前端工程师个人的能力是相辅相成的。目前,前端工程师很多是“半道出家”,一部分是从页面UI开发转行为Web前端开发的,一部分则是由后端工程师转行而来,所以前端工程师普遍自学成才,并没有受过足够的专业训练,也缺乏实际的项目经验。
除了以上这些Web前端开发的外在环境之外,Web前端在技术方面也存在着大量的挑战,大量旧的网站需要重构来提高网站用户体验和性能等。这些网站的前端代码普遍存在的问题有:代码组织混乱,CSS代码和JavaScript代码混合在HTML代码中;代码的格式问题突出,不够整洁;页面布局随意,HTML代码不符合标准;网站整体性能差,还没有意识到要去应用诸如缓存、动态加载、脚本压缩、图片压缩等提高性能的技术。
此种状况并非是个案,查看目前访问量颇高的某网站的首页源代码,可以很直观地看出其中不规范的内容:页面没有body的闭合标签,页面代码缩进随意,页面中大量使用内联样式
并且页面中还在使用诸如<marquee>、<font>等标准不推荐的标签。以下是其中的代码片段:
在这段代码中,<marquee>和<font>标签已经不再被W3C制定的标准推荐使用,
<marquee>所呈现的效果完全可以通过JavaScript代码实现,并且实现的效果可以更好。<font>标签完全可以通过CSS样式代码实现。数字前端工程师和web前端
此外,此站点首页HTML代码中包含大量不必要的标签和多余的样式设置,代码的可读性较差。再来看一段代码:
在上面的代码段中,第一段代码中的<img>标签外的<div>标签是可以省略的,<img>标签内的width和height属性可以统一通过CSS代码设置,<img>标签内需要添加必要的alt属性来说明图片的信息。在第二段代码中,依靠<br>标签来增大距离是不合语义的做法,应该通过CSS样式来设置。
另外,站点中的CSS样式文件和JavaScript脚本文件,没有任何文件被压缩和合并。推荐的做法是分别压缩合并样式文件和脚本文件,在缩小文件大小的同时也减少了文件的HTTP 请求次数,提高了性能。
综合以上的这些信息,Web前端开发的现状可以概括为:前端技术发展迅速,但起步较晚,基础薄弱;前端工程师热情高涨,但缺乏足够技能培训,对代码规范重视不足,对一些基础原理的理解不够深刻。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。