MIP入门

最新推荐文章于 2023-10-19 19:01:09 发布

Wake_me_Up123

最新推荐文章于 2023-10-19 19:01:09 发布

阅读量755

点赞数

分类专栏： html 文章标签： MIP

本文链接：https://blog.csdn.net/Wake_me_Up123/article/details/82797529

版权

html 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

MIP（Mobile Instant Pages - 移动网页加速器）

定义：一套应用于移动网页的开放性技术标准。通过提供 MIP-HTML 规范、MIP-JS 运行环境以及 MIP-Cache 页面缓存系统，实现移动网页加速。
组成部分：

MIP-HTML ：基于 HTML 中的基础标签的全新规范，通过对一部分基础标签的使用限制或功能扩展；
MIP-JS：能够保证 MIP-HTML 页面的快速渲染；
MIP-Cache：用于实现 MIP 页面的高速缓存，以提高页面性能。

MIP-HTML

对 HTML 基础规范进行扩展。
示例：

<!DOCTYPE html>
<html mip>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width,minimum-scaled,initial-scale=1">
		<link rel="stylesheet" type="text/css" href="https://c.mipcdn.com/static/v1/mip.css">
		<link rel="canonical" href="https://www.example.com/your/path.html">
		<noscript>
			<style mip-officialrelease>
				body {
					-webkit-animation:none;
						-moz-animation:none;
						  -ms-animation:none;
						  		 animation:none;
				}
			</style>
		</noscript>
	</head>
	<body>
	</body>
</html>

MIP-HTML 规范中有两类标签：常规标签和 MIP 标签。
例如：标签，它使得图片只在需要时才进行加载，减少了页面渲染时间，节省了用户流量。

MIP-JS

MIP-JS 管理资源的加载，支持 MIP 标签，能够异步加载所有外部资源，整个页面渲染过程不会被页面中的某些元素阻塞，从而实现页面渲染速度的提升。
此外，MIP-JS 涵盖所有 iframe 的沙盒、在资源加载前提前计算页面元素布局、禁用缓慢 CSS 选择器等技术性能。

MIP-Cache

一套基于代理的 CDN（Content Delivery Network）缓存系统，可用于缓存所有被百度相关页面引用或者从百度相关服务点出的 MIP 页面。
用户在访问 MIP 页面时，请求会首先发到 CDN 服务器上，如果页面存在，则从 CDN 返回，不存在时才会请求第三方服务器。
MIP-Cache 服务器会将页面缓存到 CDN 上。在使用 MIP-Cache 时，MIP 页面会将所有的静态文件和外部资源缓存到 CDN 上（视频除外），同时，页面的资源链接会被转换成相对地址，这样能很大程度上提升页面渲染速度。
每一个 MIP 页面都会绑定一个验证系统，渲染页面时，验证器可以直接在浏览器控制台输出页面错误，并且随着代码逻辑的变化，能够展示其对页面性能以及用户体验的影响。