web前端优化之内容优化
前端内容优化主要有以下几条:
1.尽量减少http请求
(1)合并文件,把多个css文件合并在一起;
(2)css Sprites,把css相关的background元素进行背景图绝对定位;
(3)图像地图;
(4)使用data:URL scheme在实际的页面嵌入图像数据;
2.减少DNS(Domain Name System,域名系统)查找
DNS查找开销是很大的。对于国内站点来说,过多的使用站外的widget很容易引起更多的DNS查找问题。
3.尽量减少重定向
4.使得ajax可缓存
ajax的响应时间对于用户的体验是个至关重要的问题,提高响应时间的有效手段就是cache。
5.延迟载入组件
6.预加载组件
7.减少DOM元素数量
8.切分组件到多个域
主要是提高页面的并行下载能力,不要跨域名太多,否则和第二条冲突。
9.最小化iframe数量
iframe是SEO大忌,对于前端来说,有利有弊。
10.杜绝http 404错误
web前端优化之内容优化的更多相关文章
- web前端开发学习内容
应该 具备的 知识技能 :懂web标准,熟练手写 xhtml css3 并符合 符合w3c标准 代码能 兼容主流浏览器.ie6.7.8.9 ff 等. ...
- 全方位分析web前端如何进行性能优化
前言: 最近刚刚完成项目,空闲一段时间,想起之前有被问起怎么对前端进行性能优化,自己也是脑中零零散散的总不成体系,现特来总结,欢迎补充指教. 1.整体资源 (1)js.css源码压缩 (2)css文件 ...
- WEB前端开发常用的优化技巧汇总
减少HTTP请求次数或者减少请求数据的大小 页面中每发送一次HTTP请求,都需要完成请求+响应这个完整的HTTP事务,会消耗一些时间,也可能会导致HTTP链接通道的堵塞,为了提高页面加载速度和运行的性 ...
- web前端图片加载优化,从图片模糊到清晰的实现过程
在网页图片显示的时候,会发现许多网站采用了先模糊,然后在慢慢清晰的过程,这样的加载用户体验是比较好的,那么如何实现呐? 默认加载2张图片,一张缩略图,一张原图,当打开网页的时候默认只显示缩略图,然后我 ...
- web前端读取文本文件内容
html5+js实现,参照xxyy888的CSDN博客文章<使用HTML+javascrpt读取txt文本文件>失败,将作者文章中的代码重新整理了下依然不行,文章代码存在的问题是括号错误, ...
- 整理六百篇web前端知识混总
9个有用的和免费的工具来支持动态网页开发 8个基本的引导工具的网页设计师 11款CSS3动画工具的开发 2016年某前端群题目答案参考 9最好的JavaScript压缩工具 创建响应式布局的10款优秀 ...
- 学习WEB前端是应该自学还是参加培训机构?
先说观点,我强烈建议每个人都要自学,不要参加培训班. 我干web前端工程师这个职位已经有6年多的时间,之前在蚂蚁金服做过2年,后来离开是因为加班实在熬不住才走的,像这些已经上市的互联网公司几乎没有不加 ...
- Web前端开发的前景与用处
随着时代的发展,现在从事IT方向的人有很多,所以励志要成为前端开发工程师的人有很多.当然也有很多人在犹豫不知道该从事哪个方向,我今天就是来给大家分析一下Web前端开发的前景.包括工作内容,发展前景和薪 ...
- 对于一个WEB前端初学者,学前端应该注意,有什么技巧
web前端经验总结需要注意的地方和技巧如下: 1.编程思维 学习web前端开发核心在于一个“编程思维”,因为每段代码都不一样,都需要分别去看,所以只要你掌握了学习web前端的编程思维,那么写程序对于你 ...
随机推荐
- 利用COOKIE保存历史浏览商品的一个简单思路
<?php //如是COOKIE 里面不为空,则往里面增加一个商品ID if (!empty($_COOKIE['SHOP']['history'])){ //取得COOKIE里面的值,并用逗号 ...
- P01-Python中列表的复制问题
(1)使用=直接赋值 a = [1, 2, 3, [6, 7]] b = a 初始情况: a: [1, 2, 3, [6, 7]] b: [1, 2, 3, [6, 7]] ------------- ...
- 洛谷 P3204 [HNOI2010]公交线路
题面 luogu 题解 矩阵快速幂\(+dp\) 其实也不是很难 先考虑朴素状压\(dp\) \(f[i][S]\) 表示最慢的车走到了\(i\),\([i, p+i-1]\)的覆盖情况 状态第一位一 ...
- 封装通用的xhr对象(兼容各个版本)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 在 Linux 服务器上部署 nginx 之后不能访问
原文地址:https://blog.csdn.net/lipeigang1109/article/details/73295373 解决办法:https://jingyan.baidu.com/art ...
- 利用JS获取本地时间和服务器时间
<p id="labTime"> <script type="text/javascript"> //取客户端时间 setInterva ...
- 【OpenCV-Python】-图像平滑
原文为段立辉翻译,感谢Linux公社www.linuxidc.com此文档为自学转述,如有侵权请联系本人. 目标: • 学习使用不同的低通滤波器对图像进行模糊 • 使用自定义的滤波器对图像进行卷积(2 ...
- HDU 5696 ——区间的价值——————【线段树、快排思想】
区间的价值 Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others)Total Subm ...
- vue中添加swiper轮播插件
网上找了很多,最后还是官网最完整. https://github.com/surmon-china/vue-awesome-swiper 安装: 1.npm install vue-awesome-s ...
- .Net Core GB2312编码问题
1.今天抓取了一个网页的源代码.发现中文是乱码的,马上第一反应是编码问题..... 2.仔细一看基于WebClient写的代码,还真的是没有设置编码... /// <summary> // ...