澳门太阳娱乐集团官网-太阳集团太阳娱乐登录

图片资源 Base64 化在 H5 页面里有用武之地吗
分类:网页制作

图表能源 Base64 化在 H5 页面里有发挥特长吗

2016/12/15 · HTML5 · Base64

原著出处: 坑坑洼洼实验室   

澳门太阳娱乐集团官网 1

将图片能源转至base64格式后可径直放入页面作为首屏直出,也足以放入css文件中,收缩乞求,以加速首屏的显现速度。
可是图片base64化,将推动三个交汇的html或css文件,是还是不是会影响页面包车型客车渲染品质,浏览器又扶持什么呢?

Base64是大器晚成种基于六15个可打字与印刷字符来表示二进制数据澳门太阳娱乐集团官网,的意味方法

调用方法

NSString *str  = [self image2DataURL:[UIImage imageNamed:@"guanbi.png"]];

什么总计?

透过Navigation Timing记录的机要时间点来总括页面达成所用的光阴,并因而Chrome开辟工具来追踪细节

JavaScript

var timing = window.performance.timing timing.domLoading //浏览器初阶分析 HTML 文书档案第一群选取的字节 timing.domInteractive // 浏览器达成拆解剖析并且存有 HTML 和 DOM 营造达成timing.domContentLoaded伊芙ntStart //DOM 深入深入分析实现后,网页国内资本源加载起初的时日 timing.domContentLoadedEventEnd //DOM 拆解深入分析实现后,网页国内资本源加载成功的日子(如 JS 脚本加载施行达成)timing.domComplete //网页上全数能源(图片等卡塔 尔(英语:State of Qatar) 下载达成,且希图稳当的时光

1
2
3
4
5
var timing = window.performance.timing
timing.domLoading //浏览器开始解析 HTML 文档第一批收到的字节
timing.domInteractive // 浏览器完成解析并且所有 HTML 和 DOM 构建完毕timing.domContentLoadedEventStart //DOM 解析完成后,网页内资源加载开始的时间
timing.domContentLoadedEventEnd //DOM 解析完成后,网页内资源加载完成的时间(如 JS 脚本加载执行完毕)
timing.domComplete //网页上所有资源(图片等) 下载完成,且准备就绪的时间

上述定义来自chrome官方文书档案,在别的情形下可能会有出入,从测量试验结果看,上面包车型客车build时间在android+微信意况中平素是0,对此恐怕是因为渲染机制差异,此处不做深刻测验。除osx+chrome之外遭受的多寡仅作参照。

JavaScript

build = timing.domComplete - timing.domContentLoaded伊芙ntStart //间隔记录网页国内资本源加载和表现时间。 complete = timing.domComplete - timing.domLoading //页面采纳到数量开首到呈现完毕的总时间。

1
2
build = timing.domComplete - timing.domContentLoadedEventStart //间隔记录网页内资源加载和呈现时间。
complete = timing.domComplete - timing.domLoading //页面接收到数据开始到呈现完毕的总时间。
什么是Base64图片呢?

运用Base64字符串来替代图片的ULX570L属性,如下所示,以data:image/png;base64 开头。

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFgAAAAwCAYAAACVMr0DAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyMThFN0FFOTYzNDAxMUU0Qjg0MEY0MTgyQzZENjY3MSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyMThFN0FFQTYzNDAxMUU0Qjg0MEY0MTgyQzZENjY3MSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjIxOEU3QUU3NjM0MDExRTRCODQwRjQxODJDNkQ2NjcxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjIxOEU3QUU4NjM0MDExRTRCODQwRjQxODJDNkQ2NjcxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+pUgM2QAABbxJREFUeNrkW01sG0UUnqQrBWHamEqt1FKIkZBSCWH7UA49lDicuAC+U6mGA1LFoemhF6gU9wASJ3IA5YS6UYMEJxLgwImu20MOjYQdCSmHStj8RWpRsd0fEakonRfeVpPdt7Mz3tl4J33Sar2zv/727fe+92ZmZGtri9lqK7lima/yw3yGk/fXPNn+EdsA5qACoHW+1PgynoFH6vFlCZ6Jg922GmAObpWv3IwAS9m7HGRXbBi1CNwKX31rGtxc8Tg7cOpVU5e7zJ+zZp0HIy20TYILwE5+M8fGXji6vf1f/x67+f5Fduf7n0xc/kWfLmzx4BnTniuCC7bvwDNs8mveNnHUxOXrUg9+6cjhKv4p0dybG7dc4ZgCBhrf2uJ+4prwiVfENn58XdGDwRsmTIELlPDyj1+S+/74ZJ79/vG8ids8y72460jeQInwItEA4Flhu4EBSPZWp6LedAw9TDD7DCSk5xCeVibA7fDlZ77P356WeKonANngXlqJOLSh8aBG7cHa+jbnAi2ENNe1VaP3Go3gu6DNGXqjorWH5VoPe3fZrxc+DbXf/uo71r9+w+i9HIInzxBCGj79zwa9CfJ1MEgVeDtFEVIuN2W3F5fZZucvNv7aie3tf/lvaDNtjoKnzvE/3BXoYRCjaGKK4GQVLieDlg/UoPYUVw/Pf3RW6xyVYOgIXuYS3NtSjfQDAGzMANxjH57ddapRAXhUAJeihmrSh+DXzpu4jq3mcABmIsCtcO8dJBDlie2oIFkLSDBtesg8wAQgLfjjHNym5DwKsDJ/Wc0AzbTxJdUlyYcIsGcqwIEiuHVlORMAi14LAa0OlMGXM5LzShQVEu1NBFHM3jyJtxuzzc6fUslFBcY0lISDevQ8psJdbK8SXl3SvLYv73YUaTjg0wLIoReyW55FBcb+9VXzAAc/SaxDBDXrkgbALQSqjvKuGSHHKOvuuSCnmMm5CeRaOwAwUIaXRTDGNLQwpNQqWZ9DeO8UIfzzWGPQtSaREheEmkemPBjKl+p6el4PYNSrboRiyGt85nGKoxAV4GKUi70UgeB6jC5qJ/WqNpEiU8WfoRtU2O631pWOBcWhmmiU0XNLMcGnMQhFgFcG6xh4zwJBRUM1APeXN94z7sHVOIWAn26SekIjQDFllqHy5W6rCFldQSfQzQic2iSUxBMHcAfXsu4ZnUAnBjF4MeeEbUpre3sVYA9rAB56aBr9Xx6RVjNJCm3EZJ2b9PEnYChU7HEruaJWJpe652BGJ0u3l9ketaTjIi5x8EZgUTh2acB9T06QS2gA4uywAd78Tb1iNjbxHDv0zlt2AIx6mKKJBaGKZ8yiut+ho1N1YAlweFKAUx06BRkiX2oxSiGx9z5dPB7Oynp39wQHy6yK2raGYBfYzqFWvtUT89z4/nBWtrZuF8BYr9CpU5wLyDE3otZRihgfoSWvRLvzw1UrVQSVKjcVX85MTJIyi6VSbTv45uuhNkNDUHddRQQB6Chq6L9ZeFTQAq7Ffj/oB6zoliyPfHB6J/f277F/JADvy+9XGnDt8OOOEcV3uL5xgCOGVKmMV7vAl4uEavB5WRxoCPQB2WRZdbjAodNvh+gBBlE/lAS43CuTWtld0q9DlSKCkR5G/MgAhg5PGIG5GuDdhg+uQDutQApdUH34wxxg0aCrPm162Ph8MRWKEEFqMXnpEkqTVUyPK5TnBlLoCsq3qDRaiTIAXPDeoFSDnmITBl8FJCi66kQ30XgMXoTX1iM8OwSuCDL7f9CKS9AQFF+6K7kiVPrIIpRsbgWAYbqArmFNHYBl4PkWxZ3nY87zga5hFz9lLpVmb3yxyPrXbkg5d0i2AI4BP5RmGYEGTiOdVbU0ZhmlbI9nGVkzERHnyV214FF3TEa0ZiIizgmeRrrKovWYzTM9BZBBxl3KENA9TJzKQXCtoogI2hj2bPsuB1UqI60G2AZ7JMAA5DJcXbfGMfsAAAAASUVORK5CYII=">
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFgAAAAwCAYAAACVMr0DAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyMThFN0FFOTYzNDAxMUU0Qjg0MEY0MTgyQzZENjY3MSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyMThFN0FFQTYzNDAxMUU0Qjg0MEY0MTgyQzZENjY3MSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjIxOEU3QUU3NjM0MDExRTRCODQwRjQxODJDNkQ2NjcxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjIxOEU3QUU4NjM0MDExRTRCODQwRjQxODJDNkQ2NjcxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+pUgM2QAABbxJREFUeNrkW01sG0UUnqQrBWHamEqt1FKIkZBSCWH7UA49lDicuAC+U6mGA1LFoemhF6gU9wASJ3IA5YS6UYMEJxLgwImu20MOjYQdCSmHStj8RWpRsd0fEakonRfeVpPdt7Mz3tl4J33Sar2zv/727fe+92ZmZGtri9lqK7lima/yw3yGk/fXPNn+EdsA5qACoHW+1PgynoFH6vFlCZ6Jg922GmAObpWv3IwAS9m7HGRXbBi1CNwKX31rGtxc8Tg7cOpVU5e7zJ+zZp0HIy20TYILwE5+M8fGXji6vf1f/x67+f5Fduf7n0xc/kWfLmzx4BnTniuCC7bvwDNs8mveNnHUxOXrUg9+6cjhKv4p0dybG7dc4ZgCBhrf2uJ+4prwiVfENn58XdGDwRsmTIELlPDyj1+S+/74ZJ79/vG8ids8y72460jeQInwItEA4Flhu4EBSPZWp6LedAw9TDD7DCSk5xCeVibA7fDlZ77P356WeKonANngXlqJOLSh8aBG7cHa+jbnAi2ENNe1VaP3Go3gu6DNGXqjorWH5VoPe3fZrxc+DbXf/uo71r9+w+i9HIInzxBCGj79zwa9CfJ1MEgVeDtFEVIuN2W3F5fZZucvNv7aie3tf/lvaDNtjoKnzvE/3BXoYRCjaGKK4GQVLieDlg/UoPYUVw/Pf3RW6xyVYOgIXuYS3NtSjfQDAGzMANxjH57ddapRAXhUAJeihmrSh+DXzpu4jq3mcABmIsCtcO8dJBDlie2oIFkLSDBtesg8wAQgLfjjHNym5DwKsDJ/Wc0AzbTxJdUlyYcIsGcqwIEiuHVlORMAi14LAa0OlMGXM5LzShQVEu1NBFHM3jyJtxuzzc6fUslFBcY0lISDevQ8psJdbK8SXl3SvLYv73YUaTjg0wLIoReyW55FBcb+9VXzAAc/SaxDBDXrkgbALQSqjvKuGSHHKOvuuSCnmMm5CeRaOwAwUIaXRTDGNLQwpNQqWZ9DeO8UIfzzWGPQtSaREheEmkemPBjKl+p6el4PYNSrboRiyGt85nGKoxAV4GKUi70UgeB6jC5qJ/WqNpEiU8WfoRtU2O631pWOBcWhmmiU0XNLMcGnMQhFgFcG6xh4zwJBRUM1APeXN94z7sHVOIWAn26SekIjQDFllqHy5W6rCFldQSfQzQic2iSUxBMHcAfXsu4ZnUAnBjF4MeeEbUpre3sVYA9rAB56aBr9Xx6RVjNJCm3EZJ2b9PEnYChU7HEruaJWJpe652BGJ0u3l9ketaTjIi5x8EZgUTh2acB9T06QS2gA4uywAd78Tb1iNjbxHDv0zlt2AIx6mKKJBaGKZ8yiut+ho1N1YAlweFKAUx06BRkiX2oxSiGx9z5dPB7Oynp39wQHy6yK2raGYBfYzqFWvtUT89z4/nBWtrZuF8BYr9CpU5wLyDE3otZRihgfoSWvRLvzw1UrVQSVKjcVX85MTJIyi6VSbTv45uuhNkNDUHddRQQB6Chq6L9ZeFTQAq7Ffj/oB6zoliyPfHB6J/f277F/JADvy+9XGnDt8OOOEcV3uL5xgCOGVKmMV7vAl4uEavB5WRxoCPQB2WRZdbjAodNvh+gBBlE/lAS43CuTWtld0q9DlSKCkR5G/MgAhg5PGIG5GuDdhg+uQDutQApdUH34wxxg0aCrPm162Ph8MRWKEEFqMXnpEkqTVUyPK5TnBlLoCsq3qDRaiTIAXPDeoFSDnmITBl8FJCi66kQ30XgMXoTX1iM8OwSuCDL7f9CKS9AQFF+6K7kiVPrIIpRsbgWAYbqArmFNHYBl4PkWxZ3nY87zga5hFz9lLpVmb3yxyPrXbkg5d0i2AI4BP5RmGYEGTiOdVbU0ZhmlbI9nGVkzERHnyV214FF3TEa0ZiIizgmeRrrKovWYzTM9BZBBxl3KENA9TJzKQXCtoogI2hj2bPsuB1UqI60G2AZ7JMAA5DJcXbfGMfsAAAAASUVORK5CYII=);

兑现格局

- (BOOL) imageHasAlpha: (UIImage *) image
{
    CGImageAlphaInfo alpha = CGImageGetAlphaInfo(image.CGImage);
    return (alpha == kCGImageAlphaFirst ||
            alpha == kCGImageAlphaLast ||
            alpha == kCGImageAlphaPremultipliedFirst ||
            alpha == kCGImageAlphaPremultipliedLast);
}
- (NSString *) image2DataURL: (UIImage *) image
{
    NSData *imageData = nil;
    NSString *mimeType = nil;

    if ([self imageHasAlpha: image]) {
        imageData = UIImagePNGRepresentation(image);
        mimeType = @"image/png";
    } else {
        imageData = UIImageJPEGRepresentation(image, 1.0f);
        mimeType = @"image/jpeg";
    }

    return [NSString stringWithFormat:@"data:%@;base64,%@", mimeType,
            [imageData base64EncodedStringWithOptions: 0]];

}

场景1,内嵌至css文件中

为什么要运用Base64编码图片呢?
  • 选取Base64编码能够减去互联网诉求
    将图片转为字符串后,图片文件会趁机HTML成分意气风发并加载,这样就能够减去HTTP央求的次数
  • 运用Base64编码的图形是随着页面一齐加载的,不会导致跨域哀告难题
  • 从未有过清理图片缓存的主题素材

1、原生引入图片链接做背景图

一张大小为50kbjpg格式图片,应用到9×15=133个dom做背景图,模拟Coca Cola图的形式,八个节点引用同一张图纸做背景,(示例卡塔 尔(英语:State of Qatar)如图。
澳门太阳娱乐集团官网 2
测试环境:Mac OS X EI Capitan 10.xx + Chrome 48.xx
其它辅助测试机器: iPhone 6 plus iOS 9.xx; 魅族Note Android 4.xx

实际上应用进程中,其余版本和机型的Android手提式有线电话机还应该有待测验

闭馆缓存状态下,build:150ms | complete: 200ms(总时间受互联网状态等要素影响,数据做相比用卡塔 尔(阿拉伯语:قطر‎
澳门太阳娱乐集团官网 3

拉开缓存状态下,build: 7ms | complete: 59ms(包含以下稳固景况下一再测验的平均值,截图为最相通平均值的景观,私下认可数据出自Mac+Chrome[48.XX版本])

澳门太阳娱乐集团官网 4

测试环境 build(单位:ms) complete(单位:ms)
OS X+Chrome 7 59
iOS+微信 45 90
OS X+Safari 50 100
Android+微信 0 120
Base64图片的弊病?
  • Base64编码后生成的字符串大小会增加约十分四,增大HTML/CSS体量,而且可读性差
  • IE8-不相称,由于IE8以下不援救data url格式

2、引进base64格式图片做背景图

将地方50kb大小的jpg图片调换为base64格式,加在css文件中。

关闭缓存状态下,build:80ms | complete: 280ms

澳门太阳娱乐集团官网 5
拉开缓存状态下,build: 160ms | complete: 210ms

澳门太阳娱乐集团官网 6

测试环境 build(单位:ms) complete(单位:ms)
OS X+chrome 160 210
iOS+微信 35 100
OS X+Safari 9 90
Android+微信 12 150
选择情况
  • 图表的尺寸十分小,且少之甚少被更新
  • 存在跨域节制之处
  • 不想页面缓存的图片

3、调解图片容量

调度方面图片的(压缩品质卡塔 尔(英语:State of Qatar)体量,base64化后,对应的css文件大小也随着变动

图片大小 10kb 20kb 45kb 100kb 180kb
对应css文件大小 27kb 42kb 76kb 150kb 260kb
Rendering时间 30ms 46ms 81ms 156ms 258ms

澳门太阳娱乐集团官网 7

4、调度引用次数

50kb大小的图样,base64化后,调度援用图片做背景图的dom的个数

引用次数 10 20 50 100 135
Rendering时间 15ms 19ms 44ms 74ms 83ms

澳门太阳娱乐集团官网 8

深入分析和小结:

在OSX+Chrome情形下,将50kb的图样base64后归入样式中,build进程扩张了约20倍,使用Timeline工具得以看见,计算样式梗塞了全套经过。

澳门太阳娱乐集团官网 9

  1. 比起一贯引进图片地址,css文件中引进base64格式的图形对体制渲染的品质消耗显著,假如大度用到,会推动功耗和发热的题材,需稳重使用。
  2. Rendering消耗的岁月同css文件大小、援用次数差不离成正比(未测量检验其余极限状态卡塔尔,在互连网条件优秀的4G境况,50~70ms的RTT(往返时延卡塔 尔(阿拉伯语:قطر‎情状下,平常活动网络的气象会更差,对于首屏优化,合适的选择如故很值得的。
  3. 图片转成base64编码后,文书档案大小较原版的书文件大了大器晚成部分,而通过 gzip 后两者大约从不区分。

场景2,内嵌至js文件中

1、原生形式直接加载多张图片

大小10~70kb共9张图纸。总大小约300kb

关闭缓存:build: 300ms | complete: 310ms

澳门太阳娱乐集团官网 10
敞开缓存:build: 110ms | complete: 120ms

澳门太阳娱乐集团官网 11

测试环境 build(单位:ms) complete(单位:ms)
OS X+Chrome 110 120
iOS+微信 50 100
OS X+Safari 148 150
Android+微信 50 100

2、转换来base64格式,归总伏乞

将地方的图纸转成base64后,放在js文件中,加载进来。

关闭缓存:build: 0ms | complete: 400ms

澳门太阳娱乐集团官网 12

翻开缓存:build: 0ms | complete: 80ms

澳门太阳娱乐集团官网 13

测试环境 build(单位:ms) complete(单位:ms)
OSX+Chrome 110 120
iOS+微信 0 35
OS X+Safari 7 70
Android+微信 0 250

3、相比较不相同网速下一起乞请和统大器晚成央浼的加载效用

使用上述1、2的测量检验demo分别在3G、4G网速条件下测量试验结果如下:

  • 在网络碰到差的情况下,合併央求明显降低了全体加载时间;
  • 在网络景况较好的WIFI和4G下则差异一点都不大。
测试环境 图片直接加载 complete(单位:ms) base64合并请求 complete(单位:ms)
3G 6000 4500
4G 450 400
WIFI 320 340

澳门太阳娱乐集团官网 14

拆解解析和小结:

base64后的的js能源达381kb,在二个线程里加载,消耗大量时日,从总括结果看,在渲染质量差别上并未场景1那么鲜明。
但有缓存的情事下,页面渲染完结的进程以至更加快。
从Timeline里见到细节,深入深入分析那几个近400kb的js文件对一切渲染进程招致了一定压力,但是总共40ms的剖析时间是一心能够采纳的。

澳门太阳娱乐集团官网 15

  1. 从html里直直接引用图片链接和base64图片对渲染质量的熏陶差十分少未有不一致,在网络条件差的意况下,归并央求却能大大进步加载作用;
  2. 一向引用至html,不恐怕缓存,将base64后的图纸财富位居js文件中管理,方便设置缓存。
  3. 有三个劣势就是图片能源base64化要求扩张创设筑工程具来支撑。

运用提议

  1. 图片财富的base64编码进css文件会带来一定的习性消耗,需严慎使用。
  2. 将图纸能源编码进js文件中,管理和预加载H5应用的图形能源,合理的联结恳求能够大大提升页面体验。

    1 赞 1 收藏 评论

澳门太阳娱乐集团官网 16

本文由澳门太阳娱乐集团官网发布于网页制作,转载请注明出处:图片资源 Base64 化在 H5 页面里有用武之地吗

上一篇:HTML5 游戏支付底蕴的学科 下一篇:没有了
猜你喜欢
热门排行
精彩图文