Web前端开发技术与优化研究网站设计论文计算机论文Word格式文档下载.docx

Web前端开发技术与优化研究网站设计论文计算机论文Word格式文档下载.docx

《Web前端开发技术与优化研究网站设计论文计算机论文Word格式文档下载.docx》由会员分享，可在线阅读，更多相关《Web前端开发技术与优化研究网站设计论文计算机论文Word格式文档下载.docx（5页珍藏版）》请在冰豆网上搜索。

　　关键词：

Web前端开发技术,优化,稳定性,安全性

　　结合用户需求,对网络构建,维护力度的增加,各行业以逐步认识到了网站建设的价值。

而Web前端开发技术作为网络维护的手段之一,能够解决当前网络使用中网络不稳定、浏览器不兼容以及安全性等问题,为用户网络使用带来更好地体验,因此对Web前端开发技术与优化工作进行探讨具有一定现实价值。

　　1Web前端开发技术相关概述

　　1.1Web前端技术

　　Web前端涉及HTML、CSS等方面的内容,其运行需要由HTML、URL以及HTPPT构成的主体结构的支撑,在Web前端系统中,这些构成要素承担的职能、遵守的技术标准等有所不同[1],但这些因素之间有着密切联系。

比如当用户在浏览网页过程中会输入相关网址,其中DNS服务器会对这些域名进行解析,获取相关域名对应的IP地址;

当完成上一环节工作后,服务器能够接受到浏览器所发送的请求,来确定对应的目标文件进行调用,就会形成HTML页面,进一步服务器开始执行HTTP的请求,此时用户浏览器就会收到HTML文件,并在用户浏览界面对文件进行重新整理、排版等,最后用户就能够获取自己搜索的信息。

　　1.2Web前端开发语言介绍

　　在Web前端开发中会应用到一些工具,其中以HTML、CSS以及JavaScript为主要语言,每一种语言在前端开发中担任着不同任务[2]。

比如HTML作为一种超文本标记语言,在前端开发中发挥着结构调整、图形修正等作用,与大家熟悉的Flash语言的作用相似,并且作为当前比较流行的制作手段,一定程度可以将Flash语言[3]。

CSS语言与其他语言相比较而言,在前端开发中起到将网页内容、样式等进行分离的作用,主要是对网站外观效果进行修饰,网页外观的规则进行有效控制,比如常见的网页透明、阴影等特效的制作就会应用CSS语言。

JavaScript作为语言汇编中区分代码、内容的语言,避免出现兼容情况。

　　2Web前端开发技术优化的流程

　　Web前端开发技术优化,需要对其涉及的各环节进行优化,比如对服务器、浏览器以及传输过程等环节的工作进行改进[4]。

本文主要以B/S架构的工作原理为主,结合浏览器对服务器页面请求的过程,将Web前端优化的流程分为两个方面。

具体体现在以下方面:

　　2.1对实体之间通信过程进行调整

　　由于HTTP作为一种基于TCP或者IP协议的超文本应用层协议,对及时请求处理比较依赖,请求信息发送后不被延误而进行处理是该协议的最佳状态,并且该协议内部对超时进行设置,比如用户在等待所发出请求信息到信息返回期间消耗的时间就属于超时。

当前大多数Web技术开发需要借助HTTP框架来完成,大多数的浏览器、服务器数据的接收、发送等也需要该框架的支撑。

Web前端开发技术的优化需要对整个通信过程进行改进,由于该过程具有实时动态的特点,一定程度为其优化创造空间[5]。

同时,需要对实体内容之间通信的过程进行全面了解,其中涉及浏览器请求和返回处理、CSS加载等流程,对这些流程进行优化,能够间接性促使Web前端开发技术的优化。

　　2.2对各个实体进行自我改进

　　由于Web前端保护CSS、HTML等多方面的实体内容。

其中HTML的工作职责是组织内容;

CSS主要对也页面样式进行负责;

JavaScript主要是对交互工作负责,并且这些实体内容自身具有一定的特殊性,在对整个Web前端开发技术进行优化的过程中,要求对这些实体内容自身进行改进,比如实体之间的相互协调、自身的编制以及通讯标准等方面进行改进,促使其在相互统一环境下实施。

　　2.3Web前端开发技术该如何有效地进行优化

　　对Web前端进行优化,对于用户使用来说,能够实现页面加载时间的缩短,操作的反应速度加快,为用户获取、传递信息带来更佳体验[6]。

同时,站在互联网企业的角度来说,对Web前端进行优化,促使页面请求数、所占宽带等缩减,间接性实现了服务器资源的有效利用。

具体从以下方面入手。

　　2.3.1各个实体之间通信过程的优化策略

　　首先,由于每一个HTTP请求都会消耗一定时间,如果将多个环节的请求综合起来,必然会消耗比较多的时间,自然会影响用户获取信息的时间,间接性给用户上网带来比较差的体验,使用户上网的成本有所增加,也会造成运营商宽带资源的浪费。

面对这种现状,要求对HTTP请求工作进行改进,比如将无用请求、不必要请求数量减少。

　　其次,用户浏览网页过程中存在一定的等待时间,而这些等待时间是由DNS查询引起的。

浏览器在开展下一步工作之前需要完成DNS解析处理工作,而一次查询需要消耗20～120ms的时间,一旦浏览器比较频繁的发出DNS解析请求[7],则会造成整个传输时间的增多,这样用户网页浏览等待的时间也会增多。

面对这种现状,要求对DNS解析查询次数尽可能地减少,对应地整个解析过程消耗的时间也会缩短,从而减少用户网页浏览等待的时间,使用户快速获取所需信息。

　　最后,用户网页浏览等待时间还受重定向的影响,其中重定向发生一次,对应的Web请求就会多一次。

面对这种现象,要求前端开发人员在Web站点的子目录后面添加/符号,能够减少重定向发生的次数。

同时,当前大多数Web浏览器、服务器对网页压缩技术都能够适应,而由于GZIP压缩技术在使用范围、应用历史等方面具有一定优势,Web前端开发人员可以尝试将该压缩技术应用到前端优化中。

　　2.3.2对每个实体内容优化的实施

　　首先,由于HTML在Web前端开发中发挥内容组织的功能,并且该技术在Web前端使用比较早,能够起到标准、规范的作用。

因此需要全面考虑该技术的优化。

比如对HTML进行语义化[8],能够促使所编写的代码更加清晰、间接;

为了避免页面图片的缩放情况,可以将页面重绘进行缩减;

为了增强页面的渲染,可以对DOM节点进行缩减。

　　其次,由于CSS在整个Web前端起到界面显示控制的功能,对于该技术的优化可以从编制次序、文件大小等方面进行入手,并考虑加载过程、优先级等方面的因素。

比如尽可能使用CSS的缩写,对重复出现的代码进行删除,使代码数量能够减少;

为了实现网页HTTP请求数量减少,可以运用CSSSprites来促使页面性能的提升。

　　最后,由于JavaScript在Web前端发挥用户交互、处理等功能,主要对浏览器产生的响应进行处理,或者对访客浏览器信息进行检测等[9]。

在对该技术进行优化可以从多方面考虑,比如尽可能减少试验全局变量、重绘以及回流等,将DOM节点的操作控制在规定范围内,或者采取采取字符串循环操作。

　　2.3.3对Web前端开发技术进行整体优化

　　首先,由于对文件进行优化涉及的范围比较大,主要对Web前端开发中涉及的CSS、JavaScript等文件进行优化。

比如将不必要的HTML标签进行剔除,对CSS代码进行优化。

　　其次,在对内容优化的过程中,要求前端开发人员将样式表放在顶部,将Script放置底部。

由于CSS技术具有覆盖层叠的特点,要求在加载完成之后,开展浏览器渲染方面的工作,或者从CSS自身加载方面开展这方面的工作。

　　最后,由于Web前端开发技术的优化需要技术人员的支持,为了实现该工作的优化效果,可以采取培训、讲座等方式来提高技术人员的综合素养。

比如定期组织专家讲座、技能培训等活动,促使Web前端开发人员专业技能不断提升,能够适应用户更高要求对Web前端进行优化,增强用户网络使用的满意度[10]。

　　结语

　　Web前端开发技术的不断优化,一方面可以为用户上网带来更佳的体验效果,间接性减低用户上网的成本;

另一方面能够突显出信息技术升级和优化的价值。

同时,在实际的前端优化过程中,可以从实体内容、通信过程方面入手,也可将二者进行有机结合,实现页面级别和代码级别的优化。

　　参考文献

　　[1]陈月,秦福建.Web前端开发技术以及优化方向探究[J].信息与电脑（理论版）,2016（04）:

35+37.

　　[2]周文君.基于网站制作的Web前端开发技术与优化[J].电子技术与软件工程,2017（10）:

60.

　　[3]宋凌霄.基于网站制作的Web前端开发设计[J].计算机产品与流通,2019（01）:

41.

　　[4]陈捷.基于网站制作的Web前端开发技术与优化[J].现代信息科技,2019,3（08）:

111-112.