zuo_zuo_blog
zuo_zuo_blog

浏览器渲染原理

从用户在浏览器地址栏输入网址，到看到整个页面，中间都发生了哪些事情？
1.HTTP请求阶段
2.HTTP响应阶段
3.浏览器渲染阶段

浏览器渲染页面的机制和原理
进程：Process 一个程序就是一个进程
线程：Thread
栈内存：Stack 用来提供环境

客户端（浏览器）浏览器内核
拿到代码后，浏览器在内存条中开辟出一块栈内存，用来给代码的执行环境，同时分配一个主线程去一行行的解析执行（进栈执行，执行完出栈），当浏览器遇到link、script、img等请求时候，都会开辟全新的线程去加载资源文件。

自上而下执行完之后，只生成dom树。然后去TASK QUEUE任务队列中看执行完的任务（事件循环Event Loop）。CSS处理完生成CSSDOM。共同生成一个渲染树--------通知电脑的CPU
浏览器渲染原理_第1张图片
浏览器渲染原理_第2张图片

Request请求阶段：DNS解析（DNS缓存）、TCP协议的三次握手喝四次挥手、HTTPS和HTTP的区别
Response响应阶段：HTTP状态、304缓存、HTTP报文

了解浏览器原理可以性能优化：减少http请求（次数和大小），所有CSS合并压缩，图片懒加载，音视频走流文件
服务器端 （Web服务器）

你可能感兴趣的:(ＪａｖａＳｃｒｉｐｔ)

  • 初识vscode，留下点设置及初步插件 岿然 vscode
    初识vscode，留下点设置以及插件备用1、插件类Beautify一款相当优秀的代码格式化工具，比自带的好用。BracketPairColorize这是一个识别括号并不同颜色的插件，让代码更容易识别。Colorize当键入颜色代码后会出现可视化颜色。ＨＴＭＬＣＳＳＳｕｐｐｏｒｔ样式表提示，缩短样式编写时间。ＨＴＭＬＳｎｉｐｐｅｔｓＨＴＭＬ必备的。ＪａｖａＳｃｒｉｐｔ（ＥＳ６）ＣｏｄｅＳｎｉｐｐｅｔ
  • 【JavaScript】程序入门基础（一） mayfla htmljs编程XHTMLfunction
        ＪＳ是ＪａｖａＳｃｒｉｐｔ的简写，看着和ｊａｖａ有些像，其实没有多大关系，只是因为ｊａｖａ的名气比较大，借用一下而已。下面来总结一下写出一个js程序应具备哪些基础的知识。一、JS和HTML    首先js一般和HTML一起出现，因为js是脚本语言，它不能独立完成编程，要么是嵌套要么是引用。这样它运行在浏览器的语言才算坐实了。嵌套    首先有一个HTML文件，嵌套的意思就是js不在其他地方
  • 一行代码加速ＩＥ的ＪａｖａＳｃｒｉｐｔ的方法 dqk1985 职场休闲ＪａｖａＳｃｒｉｐｔ
    将下列代码加在JavaScript的最前面/*@cc_on_d=document;eval(’vardocument=_d’)@*/加入这样的一行代码IE的document的访问速度至少可以提高5倍以上下面是加入前和加入后的测试比较代码 //Beforevardate=newDate;for(vari=0;i<100000;i++)document;alert(newDate�Cdate);//6
  • 一行代码加速ＩＥ的ＪａｖａＳｃｒｉｐｔ的方法 dqk1985 职场休闲ＪａｖａＳｃｒｉｐｔ
    将下列代码加在JavaScript的最前面/*@cc_on_d=document;eval(’vardocument=_d’)@*/加入这样的一行代码IE的document的访问速度至少可以提高5倍以上下面是加入前和加入后的测试比较代码 //Beforevardate=newDate;for(vari=0;i<100000;i++)document;alert(newDate�Cdate);//6
  • 一行代码加速ＩＥ的ＪａｖａＳｃｒｉｐｔ的方法 purpen JavaScripthtmlIEBlog
    将下列代码加在JavaScript的最前面 /*@cc_on _d=document;eval(’var document=_d’)@*/ 加入这样的一行代码IE的document的访问速度至少可以提高5倍以上 下面是加入前和加入后的测试比较代码 // Before var date = new Date; for (var i = 0; i < 100000; i++) d
  • js对象问题 e3002 JavaScriptapple编程企业应用VB.NET
    　随着ＡＪＡＸ的大行其道，对于ＪａｖａＳｃｒｉｐｔ的面向对象编程的需求就显得极为迫切，因为大量的客户应用代码需要在客户端处理，为了增加客户端代码的开发效率，我们不得不使用面向对象的编程方式来封装我们的代码，用来构建我们自己的开发框架。　　虽然ＪａｖａＳｃｒｉｐｔ本身就是构建在对象的基础上的一个语言。我们在使用它的时候，你会发觉对象无处不在，其中包含其自身的内部对象原形Ａｒｒａｙ，Ｂｏｏｌｅａｎ，Ｄ
  • html页面js获取参数值 0624chenhong html
    1.js获取参数值js function GetQueryString(name) {      var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");      var r = windo
  • MongoDB 在多线程高并发下的问题 BigCat2013 mongodbDB高并发重复数据
    最近项目用到 MongoDB , 主要是一些读取数据及改状态位的操作. 因为是结合了最近流行的 Storm进行大数据的分析处理，并将分析结果插入Vertica数据库，所以在多线程高并发的情境下, 会发现 Vertica 数据库中有部分重复的数据. 这到底是什么原因导致的呢？笔者开始也是一筹莫 展，重复去看 MongoDB 的 API , 终于有了新发现 ： com.mongodb.DB 这个类有
  • c++ 用类模版实现链表(c++语言程序设计第四版示例代码) CrazyMizzz 数据结构C++
    #include<iostream> #include<cassert> using namespace std; template<class T> class Node { private: Node<T> * next; public: T data;
  • 最近情况 麦田的设计者 感慨考试生活
       在五月黄梅天的岁月里，一年两次的软考又要开始了。到目前为止，我已经考了多达三次的软考，最后的结果就是通过了初级考试（程序员）。人啊，就是不满足，考了初级就希望考中级，于是，这学期我就报考了中级，明天就要考试。感觉机会不大，期待奇迹发生吧。这个学期忙于练车，写项目，反正最后是一团糟。后天还要考试科目二。这个星期真的是很艰难的一周，希望能快点度过。   
  • linux系统中用pkill踢出在线登录用户 被触发 linux
    由于linux服务器允许多用户登录，公司很多人知道密码，工作造成一定的障碍所以需要有时踢出指定的用户 1/#who   查出当前有那些终端登录（用 w 命令更详细） # who root     pts/0        2010-10-28 09:36 (192
  • 仿QQ聊天第二版 肆无忌惮_ qq
    在第一版之上的改进内容:  第一版链接: http://479001499.iteye.com/admin/blogs/2100893   用map存起来号码对应的聊天窗口对象,解决私聊的时候所有消息发到一个窗口的问题. 增加ViewInfo类,这个是信息预览的窗口,如果是自己的信息,则可以进行编辑.   信息修改后上传至服务器再告诉所有用户,自己的窗口
  • java读取配置文件 知了ing
    1，java读取.properties配置文件 InputStream in; try { in = test.class.getClassLoader().getResourceAsStream("config/ipnetOracle.properties");//配置文件的路径 Properties p = new Properties()
  • __attribute__ 你知多少？ 矮蛋蛋 C++gcc
    原文地址: http://www.cnblogs.com/astwish/p/3460618.html GNU C 的一大特色就是__attribute__ 机制。__attribute__ 可以设置函数属性（Function Attribute ）、变量属性（Variable Attribute ）和类型属性（Type Attribute ）。 __attribute__ 书写特征是：
  • jsoup使用笔记 alleni123 java爬虫JSoup
    <dependency> <groupId>org.jsoup</groupId> <artifactId>jsoup</artifactId> <version>1.7.3</version> </dependency> 2014/08/28 今天遇到这种形式，
  • JAVA中的集合 Collectio 和Map的简单使用及方法 百合不是茶 listmapset
             List ,set ,map的使用方法和区别 java容器类类库的用途是保存对象，并将其分为两个概念：     Collection集合：一个独立的序列，这些序列都服从一条或多条规则;List必须按顺序保存元素  ，set不能重复元素；Queue按照排队规则来确定对象产生的顺序（通常与他们被插入的
  • 杀LINUX的JOB进程 bijian1013 linuxunix
    今天发现数据库一个JOB一直在执行，都执行了好几个小时还在执行，所以想办法给删除掉   系统环境：    ORACLE 10G    Linux操作系统   操作步骤如下： 第一步.查询出来那个job在运行，找个对应的SID字段 select * from dba_jobs_running--找到job对应的sid &n
  • Spring AOP详解 bijian1013 javaspringAOP
            最近项目中遇到了以下几点需求，仔细思考之后，觉得采用AOP来解决。一方面是为了以更加灵活的方式来解决问题，另一方面是借此机会深入学习Spring AOP相关的内容。例如，以下需求不用AOP肯定也能解决，至于是否牵强附会，仁者见仁智者见智。 1.对部分函数的调用进行日志记录，用于观察特定问题在运行过程中的函数调用
  • [Gson六]Gson类型适配器(TypeAdapter) bit1129 Adapter
    TypeAdapter的使用动机  Gson在序列化和反序列化时，默认情况下，是按照POJO类的字段属性名和JSON串键进行一一映射匹配，然后把JSON串的键对应的值转换成POJO相同字段对应的值，反之亦然，在这个过程中有一个JSON串Key对应的Value和对象之间如何转换(序列化/反序列化)的问题。   以Date为例，在序列化和反序列化时，Gson默认使用java.
  • 【spark八十七】给定Driver Program， 如何判断哪些代码在Driver运行，哪些代码在Worker上执行 bit1129 driver
    Driver Program是用户编写的提交给Spark集群执行的application，它包含两部分 作为驱动： Driver与Master、Worker协作完成application进程的启动、DAG划分、计算任务封装、计算任务分发到各个计算节点(Worker)、计算资源的分配等。 计算逻辑本身，当计算任务在Worker执行时，执行计算逻辑完成application的计算任务
  • nginx 经验总结 ronin47 nginx 总结
    　　　深感nginx的强大，只学了皮毛，把学下的记录。 　　　获取Header 信息，一般是以$http_XX（ＸＸ是小写）            获取body,通过接口，再展开，根据Ｋ取Ｖ 　　　获取uri,以$arg_XX      &n
  • 轩辕互动-1.求三个整数中第二大的数2.整型数组的平衡点 bylijinnan 数组
    import java.util.ArrayList; import java.util.Arrays; import java.util.List; public class ExoWeb { public static void main(String[] args) { ExoWeb ew=new ExoWeb(); System.out.pri
  • Netty源码学习-Java-NIO-Reactor bylijinnan java多线程netty
    Netty里面采用了NIO-based Reactor Pattern 了解这个模式对学习Netty非常有帮助 参考以下两篇文章： http://jeewanthad.blogspot.com/2013/02/reactor-pattern-explained-part-1.html http://gee.cs.oswego.edu/dl/cpjslides/nio.pdf
  • AOP通俗理解 cngolon springAOP
    1.我所知道的aop     初看aop,上来就是一大堆术语，而且还有个拉风的名字，面向切面编程，都说是OOP的一种有益补充等等。一下子让你不知所措，心想着：怪不得很多人都和 我说aop多难多难。当我看进去以后，我才发现：它就是一些java基础上的朴实无华的应用，包括ioc，包括许许多多这样的名词，都是万变不离其宗而 已。 2.为什么用aop&nb
  • cursor variable 实例 ctrain variable
    create or replace procedure proc_test01 as type emp_row is record( empno emp.empno%type, ename emp.ename%type, job emp.job%type, mgr emp.mgr%type, hiberdate emp.hiredate%type, sal emp.sal%t
  • shell报bash: service: command not found解决方法 daizj linuxshellservicejps
    今天在执行一个脚本时，本来是想在脚本中启动hdfs和hive等程序，可以在执行到service hive-server start等启动服务的命令时会报错，最终解决方法记录一下：   脚本报错如下： ./olap_quick_intall.sh: line 57: service: command not found ./olap_quick_intall.sh: line 59
  • 40个迹象表明你还是PHP菜鸟 dcj3sjt126com 设计模式PHP正则表达式oop
    你是PHP菜鸟，如果你：1. 不会利用如phpDoc 这样的工具来恰当地注释你的代码2. 对优秀的集成开发环境如Zend Studio 或Eclipse PDT 视而不见3. 从未用过任何形式的版本控制系统，如Subclipse4. 不采用某种编码与命名标准 ，以及通用约定，不能在项目开发周期里贯彻落实5. 不使用统一开发方式6. 不转换（或）也不验证某些输入或SQL查询串（译注：参考PHP相关函
  • Android逐帧动画的实现 dcj3sjt126com android
    一、代码实现： private ImageView iv; private AnimationDrawable ad; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout
  • java远程调用linux的命令或者脚本 eksliang linuxganymed-ssh2
    转载请出自出处： http://eksliang.iteye.com/blog/2105862        Java通过SSH2协议执行远程Shell脚本(ganymed-ssh2-build210.jar)   使用步骤如下： 1.导包 官网下载: http://www.ganymed.ethz.ch/ssh2/ ma
  • adb端口被占用问题 gqdy365 adb
    最近重新安装的电脑，配置了新环境，老是出现： adb server is out of date. killing... ADB server didn't ACK * failed to start daemon * 百度了一下，说是端口被占用，我开个eclipse，然后打开cmd，就提示这个，很烦人。 一个比较彻底的解决办法就是修改
  • ASP.NET使用FileUpload上传文件 hvt .netC#hovertreeasp.netwebform
    前台代码： <asp:FileUpload ID="fuKeleyi" runat="server" /> <asp:Button ID="BtnUp" runat="server" onclick="BtnUp_Click" Text="上 传" />
  • 代码之谜（四）- 浮点数（从惊讶到思考） justjavac 浮点数精度代码之谜IEEE
    在『代码之谜』系列的前几篇文章中，很多次出现了浮点数。 浮点数在很多编程语言中被称为简单数据类型，其实，浮点数比起那些复杂数据类型（比如字符串）来说， 一点都不简单。 单单是说明 IEEE浮点数 就可以写一本书了，我将用几篇博文来简单的说说我所理解的浮点数，算是抛砖引玉吧。 一次面试 记得多年前我招聘 Java 程序员时的一次关于浮点数、二分法、编码的面试， 多年以后，他已经称为了一名很出色的
  • 数据结构随记_1 lx.asymmetric 数据结构笔记
    第一章   1.数据结构包括数据的 逻辑结构、数据的物理/存储结构和数据的逻辑关系这三个方面的内容。 2.数据的存储结构可用四种基本的存储方法表示，它们分别是 顺序存储、链式存储 、索引存储 和 散列存储。 3.数据运算最常用的有五种，分别是  查找/检索、排序、插入、删除、修改。 4.算法主要有以下五个特性：  输入、输出、可行性、确定性和有穷性。 5.算法分析的
  • linux的会话和进程组 网络接口 linux
    会话： 一个或多个进程组。起于用户登录，终止于用户退出。此期间所有进程都属于这个会话期。会话首进程：调用setsid创建会话的进程1.规定组长进程不能调用setsid，因为调用setsid后，调用进程会成为新的进程组的组长进程.如何保证？ 先调用fork，然后终止父进程，此时由于子进程的进程组ID为父进程的进程组ID，而子进程的ID是重新分配的，所以保证子进程不会是进程组长，从而子进程可以调用se
  • 二维数组 元素的连续求解 1140566087 二维数组ACM
    import java.util.HashMap; public class Title { public static void main(String[] args){ f(); } // 二位数组的应用 //12、二维数组中，哪一行或哪一列的连续存放的0的个数最多，是几个0。注意，是“连续”。 public static void f(){
  • 也谈什么时候Java比C++快 windshome javaC++
      刚打开iteye就看到这个标题“Java什么时候比C++快”，觉得很好笑。   你要比，就比同等水平的基础上的相比，笨蛋写得C代码和C++代码，去和高手写的Java代码比效率，有什么意义呢？   我是写密码算法的，深刻知道算法C和C++实现和Java实现之间的效率差，甚至也比对过C代码和汇编代码的效率差，计算机是个死的东西，再怎么优化，Java也就是和C
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他