前端内容优化主要有以下几条:

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前端优化之内容优化的更多相关文章

  1. web前端开发学习内容

    应该 具备的 知识技能 :懂web标准,熟练手写 xhtml css3 并符合 符合w3c标准                       代码能 兼容主流浏览器.ie6.7.8.9 ff 等.    ...

  2. 全方位分析web前端如何进行性能优化

    前言: 最近刚刚完成项目,空闲一段时间,想起之前有被问起怎么对前端进行性能优化,自己也是脑中零零散散的总不成体系,现特来总结,欢迎补充指教. 1.整体资源 (1)js.css源码压缩 (2)css文件 ...

  3. WEB前端开发常用的优化技巧汇总

    减少HTTP请求次数或者减少请求数据的大小 页面中每发送一次HTTP请求,都需要完成请求+响应这个完整的HTTP事务,会消耗一些时间,也可能会导致HTTP链接通道的堵塞,为了提高页面加载速度和运行的性 ...

  4. web前端图片加载优化,从图片模糊到清晰的实现过程

    在网页图片显示的时候,会发现许多网站采用了先模糊,然后在慢慢清晰的过程,这样的加载用户体验是比较好的,那么如何实现呐? 默认加载2张图片,一张缩略图,一张原图,当打开网页的时候默认只显示缩略图,然后我 ...

  5. web前端读取文本文件内容

    html5+js实现,参照xxyy888的CSDN博客文章<使用HTML+javascrpt读取txt文本文件>失败,将作者文章中的代码重新整理了下依然不行,文章代码存在的问题是括号错误, ...

  6. 整理六百篇web前端知识混总

    9个有用的和免费的工具来支持动态网页开发 8个基本的引导工具的网页设计师 11款CSS3动画工具的开发 2016年某前端群题目答案参考 9最好的JavaScript压缩工具 创建响应式布局的10款优秀 ...

  7. 学习WEB前端是应该自学还是参加培训机构?

    先说观点,我强烈建议每个人都要自学,不要参加培训班. 我干web前端工程师这个职位已经有6年多的时间,之前在蚂蚁金服做过2年,后来离开是因为加班实在熬不住才走的,像这些已经上市的互联网公司几乎没有不加 ...

  8. Web前端开发的前景与用处

    随着时代的发展,现在从事IT方向的人有很多,所以励志要成为前端开发工程师的人有很多.当然也有很多人在犹豫不知道该从事哪个方向,我今天就是来给大家分析一下Web前端开发的前景.包括工作内容,发展前景和薪 ...

  9. 对于一个WEB前端初学者,学前端应该注意,有什么技巧

    web前端经验总结需要注意的地方和技巧如下: 1.编程思维 学习web前端开发核心在于一个“编程思维”,因为每段代码都不一样,都需要分别去看,所以只要你掌握了学习web前端的编程思维,那么写程序对于你 ...

随机推荐

  1. 题目1010:A + B(字符串拆分)

    问题来源 http://ac.jobdu.com/problem.php?pid=1010 问题描述 给我们一行标准的字符串,整行读入之后,把它拆开转换成数字进行计算. 问题分析 首先考虑一个问题:如 ...

  2. 编程开发之--Oracle数据库--存储过程使用动态参数绑定(3)

    1.动态参数绑定,可以实现动态的执行不同的sql --创建包 create or replace PACKAGE MYPACKAGE AS type empcursor is ref cursor; ...

  3. P01-Python中列表的复制问题

    (1)使用=直接赋值 a = [1, 2, 3, [6, 7]] b = a 初始情况: a: [1, 2, 3, [6, 7]] b: [1, 2, 3, [6, 7]] ------------- ...

  4. 海思的一个 Makefile 解析

    Makefile 原文 include ../Makefile.param #ifeq ($(SAMPLE_PARAM_FILE), ) # SAMPLE_PARAM_FILE:=../Makefil ...

  5. 获取指定<文字行数>的<高度>是多少 TextKit

    - (CGSize)maxLineSizeWithLines:(NSInteger)lines constraintSize:(CGSize)size attributes:(NSDictionary ...

  6. Springboot第三篇:与前端fetch通信(关于前端传输json数据上传文件等等前后端的处理)

    关于前端接口传递的方法,推荐按以下使用: 若要在服务器上创建资源,推荐使用POST方法 若要检索某个资源,推荐使用GET方法 若要更新资源,推荐使用PUT方法 若要删除某个资源,推荐使用DELETE方 ...

  7. mkvirtualenv创建python虚拟环境

    为什么要创建虚拟环境呢? 如果在我们本地开发好几个项目,每个项目又用到很多第三方插件,如果没没用创建虚拟环境,那么本地项目插件就会很多很乱,如果有虚拟环境就不一样了 虚拟环境安装 pip instal ...

  8. C++下遍历文件夹

    编写程序遍历文件夹及其子文件夹下所有文件,并输出到标准输出流或者文件流. 1. 先考虑在单层目录下,遍历所有文件.以C:\WINDOWS为例: 用到数据结构_finddata_t,文件信息结构体的指针 ...

  9. c++第二次作业

    1.函数重载编程练习编写重载函数add(),实现对int型,double型,Complex型数据的加法.在main()函数中定义不同类型数据,调用测试. #include<iostream> ...

  10. 小白详细解析C#反射特性实例

    套用MSDN上对于反射的定义:反射提供了封装程序集.模块和类型的对象(Type 类型).可以使用反射动态创建类型的实例,将类型绑定到现有对象,或从现有对象获取类型并调用其方法或访问其字段和属性.如果代 ...