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. [LintCode] Maximum Depth of Binary Tree 二叉树的最大深度

    Given a binary tree, find its maximum depth. The maximum depth is the number of nodes along the long ...

  2. 使用JS实现图片展示瀑布流效果

    不知大家有没有发现,一般的图片展示网站都会使用瀑布流效果,所谓的瀑布流 就是网站内的图片不会一下子全缓存出来,而是等你滚动到一定的距离的时候, 下面的图片才会继续缓存,并且图片也是随机出现的,只是宽度 ...

  3. css 温故而知新 slideDown/slideUp 新思路

    默认设置高度为0; -webkit-transition:.3s all ease;transition:.3s all ease;opacity:0;height:0; 需要时添加高度即可 heig ...

  4. Oracle EBS - TNS

    TNS Setting: DEV5.VIASYSTEMS.COM=  (DESCRIPTION=    (ADDRESS=      (PROTOCOL=TCP)      (HOST=10.1.50 ...

  5. gojs绘流程图

    引用:http://www.tuicool.com/articles/eEruaqu http://www.open-open.com/lib/view/open1435023502544.html ...

  6. 设计模式之六大原则——迪米特法则(LoD,LKP)

    转载于:http://www.cnblogs.com/muzongyan/archive/2010/08/05/1793000.html  定义: 迪米特法则(Law of Demeter,LoD)也 ...

  7. NV SDK 10 (1) Clipmaps

    Clipmaps sample: Abstract Clipmaps are a feature first implemented on SGI workstations that allow ma ...

  8. Mac&iOS之多线程--转自http://geeklu.com/2012/02/thread/

    http://geeklu.com/2012/02/thread/ 首先循环体的开始需要检测是否有需要处理的事件,如果有则去处理,如果没有则进入睡眠以节省CPU时间. 所以重点便是这个需要处理的事件, ...

  9. P1041 传染病控制

    #include <bits/stdc++.h> using namespace std; const int maxn = 301; std::vector<int> son ...

  10. angular路由 模块 依赖注入

    1.模块 var helloModule=angular.module('helloAngular',[]); helloModule.controller('helloNgCrtl',['$scop ...