1、页面中大量的注释代码、空行会影响页面的加载速度
尽量去除打断的注释代码，及空行；尽可能的使用压缩后的JS、CSS文件，太小的文件没必要压缩
2、有人说CSS样式放在页面的开头，JS文件放在页面的结尾，可以提高页面的加载速度？
从页面的加载、渲染顺序来看好像是有一定的道理，但并不一定，现在大多数浏览器都支持JS文件的异步加载，其实CSS、JS文件的位置并不一定影响网站的加载速度
3、文件多少，引入过多的外部JS、CSS文件也会影响页面的加载速度
在浏览器的吞吐量一定的情况下，同时加载文件的个数是一定的。所以尽可能的整合CSS文件JS文件。使页面引入的外部文件不要过多（5-8个）
4、过多的标签对也会影响页面的加载速度
有些前端工程师喜欢一个 function方法就一个标签。这样不利于页面的加载渲染
5、过多的HTTP请求也会影响网页的加载速度，如果可以尽可能将用的数据一次读取到JS文件中存储，在需要时遍历JS的对象即可，这样可以提高网页的加载速度。
6、能用异步请求数据的尽可能的异步请求数据

对于前端JS、Html、CSS的大小、位置是否影响网站的相应时间的更多相关文章

  1. 解决前端js、css缓存问题

    去js标签库查询jquery.i18n.properties.js这个js引用到页面上: 新建一个配置文件:用上面的那个js方法调取配置文件里的版本号给其他的js加上: 示例: <script ...

  2. uiwebview 加载本地js、css、img，html从网站加载

    资源文件都是放在根目录下 1.index.html <html> <head> <title>My test Page</title> <link ...

  3. js和css文件位置对页面性能的影响

    翻译了一篇Performance上的关于页面性能的文章<DecIPhering the critical rendering path>,原文在这里.需要进一步整理和了解有关js.css等 ...

  4. grunt 单独压缩多个js和css文件【转】

    原文地址:http://xiaomiya.iteye.com/blog/2177877 使用grunt来压缩前端js,css文件 因为最近做的客户端本地项目有用到十几个js,js提交之前都需要压缩.用 ...

  5. JavaScript使用localStorage缓存Js和css文件

    对于WebApp来说,将js css文件缓存到localstorage区可以减少页面在加载时与HTTP请求的交互次数,从而优化页面的加载时间.特别是当移端信号不好高延迟时优化效果还是很显见的 下面的代 ...

  6. [转][前端优化]使用Combres合并对js、css文件的请求

    本文转自:http://www.cnblogs.com/parry/archive/2011/01/28/Reduce_Http_Request_Using_Combres_For_Js_Css.ht ...

  7. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

  8. JS 和 CSS 的位置对其他资源加载顺序的影响

    JS 和 CSS 在页面中的位置,会影响其他资源(指 img 等非 js 和 css 资源)的加载顺序,究其原因,有三个值得注意的点: JS 有可能会修改 DOM. 典型的,可能会有 document ...

  9. js通过查看屏幕大小，更改其他css属性

    首先,我们要知道如何得到屏幕的相关数据. <html><head><title>获取当前对象大小以及屏幕分辨率等</title><body> ...

随机推荐

  1. java 对象输入输出流

    对象的输入输出流的作用: 用于写入对象 的信息读取对象的信息. 对象的持久化. 比如:用户信息.              ObjectInputStream   : 对象输入流            ...

  2. Lua字符串库

    1. 基础字符串函数:    字符串库中有一些函数非常简单,如:    1). string.len(s) 返回字符串s的长度:    2). string.rep(s,n) 返回字符串s重复n次的结 ...

  3. 字符串转数字_atoi_stringstream

    一.#include <cstdlib> 字符串转换到整型数,函数原型:int atoi(const char *nptr) 注意事项:有符号整型,能转换的最大字符串是:"214 ...

  4. DevOps is dirty work - What's the deal

    什么是DevOps?终于又回到这个最初的问题. 第一次看到这个词的时候,还身陷于各种敏捷概念轰炸中.用“身陷”这个词其实并不准确,因为那个年代的我也是那些热情洋溢地无处不宣传敏捷的热血文艺青年中的一员 ...

  5. WPF重写Image实现动态图片--未测试

    WPF很强大,但是当WPF的image控件遇到gif时就只读了图片的第一帧,很好很强大! WPF不屑于gif的简单动画! 幸好WPF里有MediaElement这个东西,它是对MediaPlyer的一 ...

  6. Thinkphp 1.验证规则 2.静态定义 3.动态验证

    一．验证规则 数据验证可以对表单中的字段进行非法的验证操作.一般提供了两种验证方式: 静态定 义($_validate 属性)和动态验证(validate()方法). //验证规则 array( ar ...

  7. 内置函数dict

    本函数是从可迭代对象来创建新字典.比如一个元组组成的列表,或者一个字典对象. 例子: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 #dict() #以键对方式构造字典 ...

  8. iOS10 适配、Xcode8配置总结

    随着iOS10的推送更新到来,勤劳的程序员又在加班加点的搬砖了,为此收集了一些iOS10 更新的技能给大伙参考,不断更新喜欢就star 前沿 一.Xcode8 插件你去哪了 以为是和之前一样 Xcod ...

  9. 【Android测试】UI自动化代码优化之路（临时发布, 随时删除）

    ◆版权声明:本文出自胖喵~的博客,转载必须注明出处. 转载请注明出处:http://www.cnblogs.com/by-dream/p/5993622.html 关于UI自动化的抱怨 听过不少人这样 ...

  10. node静态资源管理变迁之路

    使用express自带的,express.static,如:app.use(express.static('hehe')),就可以用localhost/hua.png,访问项目根目录下,hehe文件夹 ...