页面加速Chromium 预压 Prerendering
前者已经推出了一个博客prefetch预加载的网页资源,以提高网页加载速度,下面我们一起来看一下,以加速网页chromium prerendering.介绍prerendering之前。先介绍两个概念:
背景:
打开这个链接我们能够看到视频里的Google搜索结果页对照。 使用prefetching 的效果能马上显示出网页. 这样的结果相信大家都会感到吃惊. so amazing。!
可能技术人员更加关心Google chrome怎样做到的,以下我们一起来探秘prerendering实现。
什么是prerendering ?
用户的下一页能马上显示就是通过prerendering技术实现的。prerendering
扩展prefetching概念, 不只预先获取顶层的资源, prerendering 会预先在后台准备下一个页面所须要的全部资源。Prerending的行为有点像我们open behind(后台打开页面) ,当我们把后台页面切换到前台时能马上显示网页。"background tab" 用户是全然不可见的。 当用户要切换到这个background 页面时, 后面的background tab 会被swap到前段。 这样用户能马上看到网页信息。
触发prerendering语法
<span style="font-size:14px;"><link rel="prerender" href="http://www.cmcm.com"> prerendercmcm </link></span>
prerendering 触发方式非常像firefox的prefetching 也是一个HTML中得<link> tag。可是chrome的 prerendering 不支持 meta-http和 hettp header触发。
浏览器怎样prerendering & prerendering时机
使用prerendering 限制与开关
hl=zh-CN">Page Visibility API
提供方便的途径来探測你的站点是否正在prerender。关闭这个功能能够从地址栏上输入--prerender-from-omnibox=disabled
.
探測一个网页是否正在被prerender
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdHlwZW5hbWU=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">
Prerender性能測试
site/page load time | enable prerendering | none prerendering | improve(%) |
www.cmcm.com | instant page | 9470 | 100 |
www.taobao.com | instant page | 1112 | 100 |
Prerender 在chromium中的实现
后台页面会被创建用来prerendered url,这个后台页面会载入全部资源,包括可运行的javascript。当用户訪问prerendered页面时。 后台页面会被swap到前台。以下我们看一下chromium prerender过程。
当chromium主进程收到PrerenderHostMsg_AddLinkRelPrerender时,会检測当前是否有过多的渲染进程,假设已经有同样的任务在进行则不做处理。反之就会对接收到的url进行prerender。在android上因为有限的资源限制会重用prerendering使用的process,
为了回收资源chromium会在此启动一个计时器来销毁未被使用的prerender 后台页面。在chromium35版本号中定时器时间是1000毫秒(ms) 在早期的chromium实现其中是30ms,当然这个数值未来还会发生变化。
页面加速Chromium 预压 Prerendering的更多相关文章
- 百度MIP移动页面加速——不只是CDN
MIP是用CDN做加速的么?准确答案是:是,但不只是. MIP全称Mobile Instant Pages,移动网页加速器,是百度提出的页面加速解决方案.MIP从前端渲染和页面网络传输两方面进行优化, ...
- MIP如何为页面加速?
MIP是近日由百度发起的开源项目,它的核心是一套应用于移动网页的开放性技术标准,通过提供MIP-HTML规范.MIP-JS运行环境以及MIP-Cache页面缓存系统,实现移动网页加速. 换言之就是,M ...
- 【页面加速】配置Nginx加载ngx_pagespeed模块,加快网站打开的速度
ngx_pagespeed 是一个 Nginx 的扩展模块,可以加速你的网站,减少页面加载时间,它会自动将一些提升web性能的实践应用到网页和相关的资源(CSS.JS和图片)上,无需你修改内容和流程. ...
- 在 Laravel 应用中使用 pjax 进行页面加速
说明# PHPHub 使用 pjax 来加速网页的加载, 这篇文章是在开发完此功能后做的笔记. 什么是 Pjax# .--. / \ ## a a ( '._) |'-- | _.\___/_ ___ ...
- 理解WebKit和Chromium(电子书)
前言 基础篇 WebKit, WebKit2, Chromium和Chrome介绍 WebKit和Blink WebKit和Chromium代码目录结构介绍 WebKit和Chromium功能模块 ...
- 【转】W3C中国与百度联合组织移动网页加速技术研讨会
2017 年 8 月 30 日,W3C 会员百度在北京中关村软件园国际会议中心主办了 "移动网页加速技术研讨会",W3C 中国以及腾讯.阿里巴巴及 UC.搜狗.小米.傲游.中国移动 ...
- 国内CDN加速现状
什么是CDN CDN的全称是Content Delivery Network,即内容分发网络.是位于网络层与应用层之间的网络应用,其目的是通过在现有的Internet中增加一层新的网络架构,将网站的内 ...
- MIP缓存加速原理 MIP不仅仅只是CDN
什么是MIP?我想我们现在都知道.可是你真的了解MIP吗?MIP加速原理是什么?MIP 是用 CDN 做加速的么?准确答案是:是,但不只是. 很多人并认为MIP百度排名会靠前,甚至权重会提高?作为一个 ...
- 关于CDN对动态网站加速的一些看法
CDN的全称是Content Delivery Network,即内容分发网络.其目的是通过在现有的Internet中增加一层新的网络架构,将网站的内容发布到最接近用户的网络"边缘" ...
随机推荐
- 优化移动设备上SharePoint 2013网站
优化移动设备上SharePoint 2013网站 本文由SPFarmer翻译自Waldek Mastykarz的文章 移动市场在持续的增长.在不远的将来,使用移动设备浏览站点将会超过电脑.为了保证用户 ...
- 玩转web之JQuery(二)---改变表单和input的可编辑状态(封装的js)
var FormDeal = { /** * 功能 :将表单的所有input都设为可编辑的 *@param 要操作表单的id */ formWritable: function (formId) { ...
- Android MVC MVP
从.NET的宠物商店到Android MVC MVP 1 一些闲话 记得刚进公司的时候,我们除了做常规的Training Project外,每天还要上课,接受各种技术培训和公司业务介绍.当时第一次 ...
- hive RegexSerDe View
EXTERNALkeyword它允许用户创建一个外部表.在表中的同时施工指定的路径中的实际数据(LOCATION).Hive 创建内部表时.会将数据移动到数据仓库指向的路径:若创建外部表,仅记录数据所 ...
- [勘探开发]成绩,全栈开发,健全&借贷
开发探索的一些update: 将结果做为开发的基础和终极目标 开发人员从过程的追求到最后结果的追求是一个质变的过程.相当于NBA中得分王和总冠军的差别: 一个是完毕一个局部的本职工作(有时候会和项目的 ...
- 2.大约QT数据库操作,简单的数据库连接操作,增删改查数据库,QSqlTableModel和QTableView,事务性操作,大约QItemDelegate 代理
Linux下的qt安装,命令时:sudoapt-get install qt-sdk 安装mysql数据库,安装方法參考博客:http://blog.csdn.net/tototuzuoquan ...
- [LeetCode107]Binary Tree Level Order Traversal II 二叉树层次遍历
题目: Given a binary tree, return the bottom-up level order traversal of its nodes' values. (ie, from ...
- IT忍者神龟之使用 PowerDesigner
1. 启动 PowerDesigner 新建物理数据模型 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdmlweWhk/font/5a6L5L2T/fon ...
- configure.ac:20: error: Autoconf version 2.65 or higher is required
安装thrift例如,下面的问题出现: configure.ac:20: error: Autoconf version 2.65 or higher is required wget http:// ...
- HDU 4864Task(更多的联合培训学校1)(贪婪)
职务地址:pid=4864">HDU4864 这题又是一上来觉得是最小费用流,可是边太多.果然,敲完交上去后不断TLE.. 小优化了两次也没过. . . sad.. 后来看了题解才发现 ...