`
highfly-s
  • 浏览: 100813 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

web前端优化

 
阅读更多

 

做为一个好的优秀前端,不仅能够写出优雅的代码,也要更加关注于性能性的问题,但由于我们在项目过程中可能会考虑到一些成本性的问题,不可能让我们的项目在性能方面面面俱到,但我们可以做到最为基本的做优化。

我们可以从以下几点进行优化:

1.       减少对服务器方面的请求

我们使用外部文件CSS JS,在某些情况下给予合并,数量上减少。一次请求多次利用,因为浏览器会在缓存中找到已经下载过的外部文件,不会再进行请求。这样以来就可以减情服务器的压力。页面元素背景使用Css Sprite的方式

2.       减少系统资源的损耗(事件回收)

对于一些从页面上清除的元素,如果元素是有绑定事件的,在清除页面之前把元素事件移除,否则事件会一直存留在内存中,这样会加大内存资源的浪费。

3.       外部脚本、CSS样式的分布位置

页面渲染的流程是从上到下的一个过程,我们要遵守CSS样式在上,JS脚本在下这个标准,CSS样式在上,避免页面的重绘和回流JS脚本在下避免页面的阻塞渲染。

 

4.       外部资源的压缩

对于CSS js进行压缩,减少带宽。用最少的时间进行下载

5.       AJAX数据缓存

对于一些固定不变的数据进行缓存,减少对于服务器的请求

6.       减少重定向

重定向会进行域名的查询,会比较损耗资源,

7.       图像优化

图片格式最好使用PNG

8.       减少阻塞方式对资源的下载,使用并形下载外部资源的引用

阻塞下载,会给予客户端比较长的等待时间,对于用户的体验来说不是很好

 

 

 

 

分享到:
评论

相关推荐

    网站Web前端优化(Html)

    网站Web前端优化主要关注提升网页加载速度、用户体验和性能效率,这一领域对于现代互联网产品至关重要。以下是关于Web前端优化的详细说明: 一、关于Web Web作为一种新媒体,它源自印刷业,但随着互联网的发展,Web...

    web前端优化方案

    web前端优化方案的知识点包括: 一、减少HTTP请求 HTTP协议无状态,每次请求都需要建立通信链路并传输数据,服务端需要为每个HTTP请求启动独立线程处理。通信和服务开销昂贵,因此减少HTTP请求可以有效提升访问性能...

    Web前端优化

    关于Web前端优化,网上已经有太多的文章,平时主要用的也就是Firefox的两个插件,Yahoo的YSlow和Google的Page Speed(如果您有其它比较好用的,分享一下哦),它们会对你的网页进行检测,哪些做的比较好,哪些还有待...

    web前端优化知识总结+笔试+面试总结.pdf

    Web 前端优化知识总结 本文总结了 Web 前端优化的知识点,涵盖了页面级别和代码级别的优化方法。优化的目的是提高用户体验和节省资源利用。页面级别的优化方法包括减少 HTTP 请求数、合理设置 HTTP 缓存、资源合并...

    web前端优化技巧1

    本文将深入探讨“web前端优化技巧1”中的关键知识点,并提供实用的优化策略。 首先,减少HTTP请求(Make Fewer HTTP Requests)是优化的核心。每个HTTP请求都会增加页面加载的时间,因为浏览器需要等待服务器的响应...

    Web前端优化最佳实践及工具集锦

    ### Web前端优化最佳实践及工具集锦 #### 一、引言 随着互联网技术的不断发展,用户对Web应用的响应速度和性能提出了更高要求。Web前端优化成为了提高用户体验的重要手段之一。本文旨在介绍一系列Web前端优化的...

    Web 前端优化最佳实践.rar

    "Web前端优化最佳实践"这一主题涵盖了多种技术策略和方法,旨在使网页加载更快,交互更流畅,从而提高用户满意度和搜索引擎排名。以下是一些核心的前端优化知识点: 1. **减少HTTP请求**:每个文件(如CSS、...

    较试实用--web前端优化知识总结+笔试+面试总结1

    Web前端优化是提升网站性能和用户体验的关键步骤,尤其在JavaScript和HTML、CSS为主的前端开发中。本文主要讨论了两个层面的优化策略:页面级别优化和代码级别优化。 首先,页面级别优化关注的是整个页面的加载速度...

    Web前端优化最佳实践及工具集锦[定义].pdf

    Web前端优化是提升Web应用程序性能的关键,它直接影响到用户体验。前端优化主要关注减少页面加载时间、提高响应速度和降低资源消耗。以下是一些由Google和雅虎提出的最佳实践和工具: 1. **避免坏请求**:确保所有...

    web前端-Web前端性能优化的研究与应用.pdf

    进行 Web 前端优化是非常必要的,因为用户不能忍受浏览网页的时候,长时间的等待。 知识点四: 影响 Web 前端性能的因素 影响 Web 前端性能的因素包括 HTTP 协议、浏览器工作方式、缓存机制、页面大小、页面结构...

    web前端优化知识总结+笔试+面试总结[参照].pdf

    Web前端优化是提升网站性能和用户体验的关键步骤,涵盖了HTML、CSS、JavaScript、图像以及其它资源的优化。优化的目的是为了使页面加载更快,对用户操作响应更迅速,从而提供更友好的浏览体验,并且减少服务器资源...

    Web 前端性能优化思路与学习方法

    Web前端性能优化是提升网页用户体验和确保网站成功的关键因素之一。性能优化涉及多个方面,包括但不限于代码优化、资源加载策略、服务器配置等。本篇内容将深入探讨Web前端性能优化的思路与学习方法,结合WebQQ、QQ...

    Web前端性能优化全攻略

    Web前端性能优化是提高网页加载速度和用户体验的关键因素。Yahoo! 的 Exceptional Performance team 提出了一系列不断更新的优化策略,从最初的13条发展到现在的34条,涵盖了多个角度,包括内容、服务器、Cookie、...

    web前端笔试题面试题汇总+前端优化总结

    web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题...

    web前端性能优化

    针对web前端性能低下的问题,王成、李少元、郑黎晓、缑锦、曾梅琴、刘慧敏等学者系统地提出了一套旨在提高网页加载速度、呈现速度和用户体验的完整Web前端性能优化解决方案。该方案涵盖了服务器端优化、HTML优化、...

    1让你页面速度飞起来,Web前端性能优化。.txt

    让你页面速度飞起来,Web前端性能优化。 让你页面速度飞起来,Web前端性能优化。百度云盘视频资料,下载直接看

    Web前端开发技术以及优化研究.pdf

    六、Web前端优化 Web前端优化是指通过使用HTML、CSS、JavaScript和Ajax等技术来提高网页的性能和用户体验的方法。Web前端优化可以从多方面入手,例如:压缩代码、缓存、使用CDN、避免过多的HTTP请求等。 七、结语 ...

Global site tag (gtag.js) - Google Analytics