Web前端的开发技术与优化研究

李鑫

摘要：随着在最近几年当中，我国的网络信息技术不断发展，我国也已经进入了web2.0时代，因此，传统的网页制作已经逐渐走上历史舞台，web前端的开发就显得尤为重要，基于此种情况在该文当中，笔者结合自己的实际工作经验对web前端的开发技术进行了必要的研究，同时总结了具体的优化策略。

关键词：Web前端；开发技术；优化

中图分类号：TP3 文献标识码：A 文章编号：1009-3044（2017）05-0056-01

自从20世纪90年代开始，我国的信息技术开始了快速的发展，基于此种情况，信息技术被广泛地运用在各行各业当中，并促进了社会的不断发展，在这个过程当中我国的技术也不断被促进，当前阶段我国已经进入了Web2.0时代。Web前端开发技术是一种基于网页制作技术发展而来的一种全新的技术，同时也是一种极具时代特征的技术。Web前端开发技术与网页制作技术之间也存在着较大的区别，网页制作技术主要是为了显示出一些静态的东西，同时用户也基本只会进行一些网站的浏览，但是在Web2.0时代中，用户对网页的要求不断被提高，基于此种情况传统的网页制作技术已经逐渐无法满足时代的需求，因此必须要进行该机，基于此种情况，笔者进行了一定的研究。

1 Web前端开发技术研究

Web前端开发的主要内容包括以下三个方面：：HTML、CSS、JavaScript，这三种语言之间本身也存在着较大的差别，同时在代码方面也具有不同的质量要求，但是也存在着一定的联系，在下文当中笔者将对Web前端开发中较为常用的技术进行必要的阐述。

1.1 HTML/XHTML

HTML5：超文本标记语言（HTML5）在结构当中具有更加清晰的结构，同时也将传统网页制作当中一些与时代发展不符的标记去除了，同时展示与内容也被完全的分离开来，这种结构被改进了的语言所生成出来的网页一般情况下都较为整洁，同时也便于管理，同时还可以在很大程度上提高客户的用户体验，通过搜索引擎以及屏幕阅读器可以实现有效的抓取，同时在移动设备当中HTML5还具有更加强大的优势，因此更适合如 Web 操作系统一类的 RIA 应用的前端开发。

1.2 层叠样式表

在Web前端的开发过程当中，层叠样式表具有非常重要的作用，层叠样式表主要是被用来控制网页的样式，同时层叠样式表允许网页的内容以及相关的样式信息可以被有效的分离开来，同时也具有更多的优势，如可以有效地提高网络浏览的速度，同时对于网络的维护也具有非常重要的意义。

1.3 JavaScript

JavaScript是Netscape公司的产品，开发目的是为了扩展Netscape Navigator的功能，是一种介于Java和HTML之间、能嵌入Web页面中基于对象和事件驱动的解释性的编程语言。JavaScript出现后，信息和用户之间不再只是简单地显示与浏览的关系，更可以进行实时、动态、可交式的表达。当前流行的Ajax也是依赖于JavaScript而存在的。

2 Web优化研究

如果一个网站仅仅在网站的服务以及页面设计具有非常好的质量，这也并不能有效地提高网站的质量，常常会出现页面存在过长的延迟时间，用户体验较差等现象，因此，必须要对Web进行必要的优化，优化的重要方式有以下几个方面的内容：

2.1 减少HTTP请求

在Web的优化技术当中，W减少HTTP请求具有非常重要的意义，在一个完整的HTTP请求当中，完整的内容主要包括以下几个方面：DNS寻址、建立和服务器的连接、发送数据、等待服务器响应、接收数据等复杂的过程，在这个过程当中用户可以深刻地感受到在这个过程当中资源是需要一定的成本的，因为在每个HTTP请求当中，都携带了大量的数据，同时每个数据都需要占用一定的网络资源，但是不管是任何浏览器都不能无限制的发送请求，如果请求的数量较多，浏览器必须要分不同的批次进行处理，这就会进一步加速用户的等待时间。当前阶段减少HTTP请求的方法主要有以下几种方式：合并文件、CSS Sprites以及内联图像等。

2.2 减压缩文件的大小

可以将CSS以及JavaScript文件进行压缩处理，同时对其中的代码进行优化，对于代码的优化主要包括减少内联样式、去除html标签和CSS的代码优化。

2.3 将script放在底部

此举措旨在防止script脚本的执行阻塞页面的下载，因而提高页面组件的下载速度，减少页面的加载时间，提高网站前端的性能。

2.4 避免重定向

在浏览网络的过程当中，如果頁面需要进行重新定向，则必须要耗费一定的时间，导致重新定向的原因多种多样，但是每次进行重新定向时都会增加一次Web请求，因此，必须要尽量的避免重定向。

3 结束语

从最开始的网络博客时代到现在的Web2.0时代，各种前端的开发以及应用都不能脱离Web本身的，在最近几年当中Web技术得到了进一步的快速发展，这对于Web应用的交互性以及系统能力都具有非常重要的意义，因此对Web前端开发技术进行研究具有非常重要的意义，基于此种情况，在本文当中笔者对现阶段的Web前端开发技术进行了必要的研究，并总结了对应的解决策略，希望能对现阶段我国的信息技术的发展有所帮助。

参考文献：

[1] 刘观宇. 面向LAMP的Web前端代码处理系统的设计与实现[D].北京： 中国科学院大学工程管理与信息技术学院， 2015.

[2] 高楠楠. 基于HTML5的WebGIS前端类库设计与性能优化实践研究[D]. 上海：华东师范大学， 2014.

[3] 刘靖桐. 面向Web2.0的web应用前端开发框架的设计与实现[D]. 北京：北京邮电大学， 2014.

[4] 李强， 杨岿， 吴天吉. 基于Asp.net的网站开发前端技术优化研究[J]. 软件导刊， 2013（5）.

[5] 曾祥坤. 发动机前端附件驱动系统旋转振动特性实测与计算方法的研究[D].广州： 华南理工大学， 2012.

[6] 郭本青. CMOS有源混频器噪声及射频接收前端关键技术研究[D]. 成都：电子科技大学， 2011.

[7] 赵欢. 面向嵌入式计算平台的自动语音识别关键技术研究[D]. 长沙：湖南大学， 2010.