返回首页
当前位置: 主页 > 网络编程 > 其他实例教程 >

MIP页面的原理和应用

时间:2019-12-27 16:05来源:知行网www.zhixing123.cn 编辑:麦田守望者

 我们要先了解什么是MIP

MIP(Mobile Instant Pages - 移动网页加速器)是一套应用于移动网页的开放性技术标准。通过提供 MIP-HTML 规范、MIP-JS 运行环境以及 MIP-Cache 页面缓存系统,实现移动网页加速。

其加速原理简单来说就是不允许自定义的JS,去除一些臃肿的客户端脚本。

具体要怎样修改现有的页面呢?

1.页面起始标签使用 <!doctype html> 。

2.<html> 标签必写且唯一,同时必须存在 mip 属性,即:<html mip> 。

3.<head> 标签必写且唯一,其父元素必须是 <html> 标签

4.<body> 标签必写且唯一,其父元素必须是 <html> 标签。

5.必须在 <head> 标签中包含字符集声明 <meta charset="utf-8"> ,不区分大小写,同时页面字符集必须使用 UTF-8 。

6.必须在 <head> 标签中包含 viewport 设置标签 <meta name="viewport" content="width=device-width,initial-scale=1"> ,其中 initial-scale=1 ,同时推荐包含 minimum-scale=1 。

7.必须在 <head> 标签中包含 <link rel="stylesheet" type="text/css" href="https://c.mipcdn.com/static/v1/mip.css"> 。

8.必须在 <head> 标签中包含 <link rel="canonical" href="http(s)://example.com"> 。

9.必须在 <body> 标签中包含 <script src="https://c.mipcdn.com/static/v1/mip.js"></script> ,如果包含在 <head> 标签中则须增加 async 属性。

10.必须把   <img> 替换为 <mip-img> 注意:mip-img 必须存在 src 或 srcset 属性之一

11.必须把  <video> 替换为 <mip-video>

12.必须把 <audio> 替换为 <mip-audio>

13.必须把<iframe> 替换为 <mip-iframe>

14.必须把<form> 替换为<mip-form>

15.必须把<style>替换为<style mip-custom> 且只能在 <head> 标签中使用一次

16.禁止使用<frame> <frameset> <object> <param> <applet> <embed> 这些标签。

17.MIP-HTML 中所有 on 开头的属性都不允许使用,如:onclickonmouseover 。

18.MIP-HTML 中允许使用 on 属性。MIP-HTML 中不允许使用 style 属性。

所有 MIP 规范都可以通过 MIP 代码校验工具进行快速检查,帮忙开发者迅速定位到问题!

 

------分隔线----------------------------
标签(Tag):
------分隔线----------------------------
推荐内容
猜你感兴趣