48
软件开发与应用
Software Development And Application
电子技术与软件工程
Electronic Technology & Software Engineering
1 Web前端开发的关键技术
在前端技术发展与应用中，有HTML 、CSS 、JavaScript 三种关键的技术，不同的语言代表着不同的使用环境，三者在代码的编写与使用的过程中，都会存在着不同的需求与差别，而随着技术的发展，根据具体开发环境的要求，可以将三者联合起来进行使用。1.1 HTML技术
HTML 属于XHTML/HTMLS 技术的统称，但它们之间还存在着一定的区别，HTML 是一种比较标准的网页标记语言，不是网页编程语言的一种，主要功能是保证网页浏览器能够正常的工作，利用浏览器能够对HTML 语言进行翻译，方便用户能在网页中阅读。XHTML 是对HTML 语言的更新，将W3C 标准作为开发的标准，从而增强了网页的互动性，增强了用户的体验效果，带分页的超文本格式(HTMLS)是HTM
L 进行更新之后的新一代标准语言，能够嵌入不同格式的文本、图片等，还能满足当前网页开发中的最新需求。在Web 前端技术开发中主要采用的HTMLS 语言，能够更加清晰的展示出网页的开发结构，与传统的HTML 网页语言相比，它在网页开发中具有更强的功能，实现了网页开发的更加简洁与方便。而且，在现代移动设备上，利用HTMLS 可以轻易的实现移动网页的设计与开发，采用HTML 语言很难满足动态、移动的效果。通过具体的应用设计中，可以发现HTMLS 具有更大的优点，也能适合Web 操作的RIA 应用前端开发。在的设计中，XHTML 拥有HTML 和HTMLS 之间的穿插性和通用性，而利用HLMLS 更能实现多元化的网页设计效果。1.2 CSS技术
CSS 样式在网页设计中应用十分广泛，所谓的CSS 是在HTML 、XML 中设计的网页中来展示某些应用的文件样式，属于层叠样式表，在Web 前端设计与开发中具有十分重要的作用，它能够对网页样式、内容等进行分割，使动态网页的个性更强，利用CSS 样式开发Web 前端，能够提高浏览器的运行速度，提高网页的维护效率，从应用的原理来分析，CSS 通过代码重叠，可以将网页格式代码简化，但它会将代码的外部样式保存在浏览器的缓存中，导致网页的页面过大，容易造成网页下载显示速度下降，导致网页浏览的时间过长，在未来的CSS 样式设计中，需要提升网页的下载速度，将样式的定义保存缓存属性中，这样用户就能非常轻松的对网页的样式进行修改与管理，提高网页设计的效率。1.3 JavaScript技术
JavaScript 属于一种直译式脚本语言，它以事件驱动为基础，从而能够实现网页设计的多种形态，包
括动态类型、弱类型、基于原型，JavaScript 作为一种脚本语言，可以忽略Web 服务器的限制，直接嵌入到HTML 设计的网页语言中，对用户的输入要求作出响应，从而能提升动态网页的交互性要求，而且JavaScript 语言对HTML 网页开发的环境依赖性要求较低，这样JavaScript 能够非常广泛的应用于现代Web 前端开发中，可以同浏览器来实现不同平台之间
Web 前端开发的关键技术javascript属于前端吗
魏鹏娟
（陕西交通职业技术学院  陕西省西安市  710000）
的数据交换，方便用户进行操作，并以最后的页面呈现给用户。1.4 DOM技术
DOM 技术主要功能是为Web 页面的设计提供标准的API ，在Web 前端开发的过程中，具有十分重要的作用，它能将XML 文档中的功能抽象为不同的节点，使之形成树状的结构，然后将其进行分析，提高Web 页面的交互性效果，也能够实现对网页中的其他标准组件访问，也能实现跨平台之间的异构页面的访问，通过设计对象OMG ，来实现对网页中的文档对象与表示对象之间的定义与访问分析。1.5 AJAX技术
AJAX 技术是网页设计中的动态交互与相互交互的关键技术，根据DOM 访问的要求，来解决网页页面
数据与服务器之间的关系，真正实现动态网页的效果，而且利用AJAX 技术可以降低后台与服务器之间的交互量，从而能够使得网络速度更快、更稳定的进行更新，提高用户的体验效果。1.6 flutter技术
在对HTML5页面进行渲染时，采用的应用内嵌浏览器控件WebView 的方式进行，虽然这种方法扩展了Web 渲染功能，但由于HTML5页面的渲染需要经历浏览器控件的加载、解析和渲染三大过程，对系统的内存消耗比较大，在跨平台使用时，受到了严重的限制。Flutter 采用跨平台的UI 设计框架，从平台的渲染逻辑、开发语言等进行融合，以减少平台之间的差异，同时保持和原生开发一样的高性能，提高Web 页面的使用范围，同时flutter 借助先进的工具链和编译器，提高了Web 页面的编辑效率，同时支持JIT 和AOT 的语言，在页面设计完成后，可以快速的发布，而且页面的执行性能较好，在代码执行效率上可以媲关原生APP ，在web 前端技术中得到了广泛的应用。2 Web前端的主要开发方向2.1 改善开发
改善网页设计的开发环境，对促进Web 前端技术的发展十分重要，利用可以采用SEO 技术改进Web 网页前端的页面运行时间管理的方法，进而能降低Web 前端页面的大小，从而降低页面的反应时间，提高网络带宽的使用效率，进而能够节省网页的调用时间，还能够降低电脑的存储空间，提高Web 页面文件的加载速度。还可以运用SEI(附加增强信息Supplemental Enhancement Information)技术，对Web 前端的程序设计进行优化，减少页面加载过程中容易出现的无关影响因素，将HTML 请求和URL 的访问进行简化处理，从而能够提高网页调用的效率。2.2 多项开发
利用多项开发技术可以对Web 前端运用的性能进行优化处理，例如能够提高Web 前端页面的开发与运行机制，改善Web 前端通信运行的网络协议、IP 地址和DNS 网址通信协议等输入，在默
摘　要：本文通过对Web 前端的关键技术进行分析，针对Web 前端开发的趋势，提出了Web 前端设计优化的策略。关键词：Web；前端开发；网页设计
49
软件开发与应用
Software Development And Application
电子技术与软件工程
Electronic Technology & Software Engineering
认DNS 网址服务的同时，并用户的IP 地址进行分析，从而能减少Web 前端页面的运行时间，提高用户与网络服务器之间的通信效率，提高整个网络的运行速度，优化Web 前端设计效果。2.3 兼容开发设计
由于在不同的网络环境中，往往需要Web 网页的跨平台操作，对于Web 前端的兼容性开发，目标是解决不同服务器、浏览器不能兼容的问题，如果用户在工作时，同时打开多个浏览器，就会增加Web 前端的运行压力，就会导致网页下载的速度过慢，影响网页的加载速度，也会导致在不同的浏览器之间切换时，影响网页的应用效果。为了改善浏览器无法兼容的情况，在具体的设计中，需要采用兼容性设计的方法来提高网页浏览的效果。
（1）采用CSS 样式技术，对Web 前端的运行程序进行改善，并对网页的运行速度进行优化处理；
（2）运用HTML 技术在Web 前端的运行程序内设立多个相互关联的反应控制程序，利用宽带的占用量缩小网页浏览中的时间差异，对多个浏览器进行处理，采用这种方面能够提高Web 前端网页设计的效率，提高网页应用的广泛性。3 Web前端技术优化策略
由于动态网页设计需要满足用户多元化的需求与交互操作的要求，提高用户的体验，同时还要降低网页的大小，能够快速响应用户的要求，提高网络通信的效率，这就需要对Web 前端技术进行优化，以满足用户的需求。3.1 在优化HTML页面的设计
HTML 、CSS 、JavaScript 是Web 前端设计的关键技术，在对其进行优化时，必须要提高几种语言的应用，HTML 作为前端的组织框架，必须要保证页面的架构清晰、代码简化，尽可能的减少一些空属性的问题，并减少页面文档对象模型的节点，提高页面的渲染与运行速度，对CSS 进行优化只要是避
免代码的重复，减少总体的代码量，尽量避免使用CSS 符层级，采用CSS 的重叠性，可以将CSS 放在顶部，利用浏览器的先完全加载信息，后在进行内容渲染的特性，可以达到对CSS 优化的目标。在前端开发具有多元化的动态特性，在程序调用时，尽量减少全局变量的使用，为避免重复调用程序，尽量不使用function 、with 、eval 等功能，并删除重复的JS ，提高程序的调用效率，同时在Web 页面设计时，将JavaScript 放在底部，防止页面脚本加载时间过长，而导致页面阻塞的问题，降低页面加载总量。3.2 在减小文件大小方面
如果动态网页设计的内容过多，容量过大，就会影响网页的下载速度，而且网页的文件越大，网页的加载速度越慢，为了提供网络带宽的利用效率，需要对网页的设计逻辑、功能等进行组件化的设计，在需要时可以随时调用，例如，在页面制作倒计时工具时，可以利用if 语句、动画、路径功能等做成组件，提高单个设计结构的可移植性，便于后期进行设计优化与调用，在具体的设计中需要做好代码的核心功能保护，以免误删或者遗失。目前，主要采用JavaScript 应用程序来开发组件，并利用CSS 样式技术对文件代码进行压缩，从而达到减少文件的目的。例如，可以通过优化Cookie ，减少不必要的Cookie ，防止Cookie 存储的信息量过大，增加网页的加载速度，提升网页的响应速度，可以通过设计过期时间，退出删除Cookie ，这就可以有效的避免在下次打开网页时，相关存储的信息发送给服务器。
3.3 在减少HTTP请求方面
在动态网页设计的过程中，有的工作人员为了达到良好的视觉效果，在设计过程中添加了一些繁琐的操作步骤，如何不能有效的对这些繁琐的步骤进行删减，就会造成HTTP 在页面请求的时间过长，也会导致HTTP 请求时间过长，给网站的运行承受了更大的负荷，而在有时还会出现一些不必要的窗口，影响着网页加载的速度。为了提高网页加载的速度，在Web 页面设计的过程中，需要设计人员能够转变思路，采用组件加载的方法来提高网页的设计效果，保证网页的功能能够齐全，提高网页操作的效果。3.4 在缩短DNS查询次数与时间方面
DNS 对网页的加载速度影响十分明显，在目前的Web 设计运行过程中，DNS 在网页加载影响十分明显，有的甚至经过了很长时间的加载也不能进入网站，影响着用户的体验效果，也降低了网页的用户访问量，这对企业网站的浏览量的提升带来了不利的影响。由于大部分用户在等待时间过长之后，不能顺利的加载网页，也就放弃等待，这样就会减少网页的整体访问效果与浏览量，阻碍网站的进一步发展。因此，在Web 网页设计时，需要采用相应的措施来缩短DNS 的查询时间与次数，例如使用Keep-Live 和较少的域名提高浏览效果，减少DNS 查，提高网页的加载速度，使用户获得更好的体验效果，增加网页的浏览量。3.5 在加强页面优化设计方面
大部分Web 网页设计为了提高浏览量，提升网站的热度，都设计良好的页面布局，提升用户的体验效果。但是，在具体的设计中，有很多Web 网页的设计难以起到吸引用户的效果，主要原因在于设计人员设计理念没有结合用户体验的要求，创新水平受到了网页固定设计的影响，或者在设计Web 网页时
注重页面的视觉效果，忽视了网页的实用性效果，导致Web 网页的整体设计没有体现出良好的效果。为了达到Web 网页优化的效果，在设计时，需要综合考虑网站的实用性效果，认真分析用户的心理效果，吸收现代文化元素，对Web 网页的设计框架进行创新，提高网页服务性，将网站的内容进行精简与浓缩，提高用户的体验效果，达到网页设计优化的效果。4 结束语
随着移动技术在网页设计中的应用，如何有效的提高Web 网页的浏览效果，需要设计者能够用户体验的角度出发，加强对Web 前端开发技术的应用进行研究与分析，在具体的设计过程中，需要充分了解JavaScript 、HTML 、CSS 等设计语言的关键应用，切实掌握了解各种及时的应用特性，进而才能有效地应对当前Web 前端开发遇到的问题，而且在Web 网页设计的过程中，要将现代文化元素融入到网页设计中，并且注意不断提升设计开发人员的专业素质，从而能够达到Web 优化设计的目标。参考文献
[1]张鑫，于涌，王典等.Web 前端技术开发的优化与研究[J].产
业与科技论坛,2019(24):55-56.
[2]白晓.Web 前端开发技术以及优化方向探究[J].无线互联科
技,2019(7):156-158.作者简介
魏鹏娟（1985-），女，陕西省宝鸡市人。研究生，助教。研究方向为信息安全、Web 前端。

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