测试页面,页面里边一次加载50张不同的图片,每张5M以上,查看浏览器的内存使用情况
测试页面
1、需要你写个测试页面,页面里边一次加载50张不同的图片,每张5M,查看浏览器的内存使用情况
2、可以10张 递增的方式测试
3、图片需要缩放,比如所有图片缩放成600*800的比例
目的
只是为了测试 图片占用浏览器的内存情况
测试情况
1、1张图
(google浏览器)没有缩放图情况下,图大小5MB以上,内存占用16MB,包含了浏览器内存,实际占用3MB。
PS:空的一个网页13MB

缩放情况下,内存占用19MB,实际占用6MB。

缩放照片不仅仅不会减少内存消耗,反而增加内存消耗。
(IE浏览器)没有缩放图情况下,图大小5MB以上,内存占用39MB

开一个空的网页占的内存,29MB
2、10张图,没有缩放图情况下,每张图大小分布在5MB大小附近,内存占用71MB。实际占用58MB

缩放情况下,内存占用68MB,实际占用55MB。

缩放照片会增加内存消耗,webkit内核在这个缩放上的算法已经优化。
3、20张图,没有缩放图情况下,每张图大小分布在5MB以上,内存占用149MB。

缩放情况下,内存占用152MB

缩放照片会增加内存消耗,webkit内核在这个缩放上的算法已经优化。
4、30张图,没有缩放图情况下,每张图大小分布在5MB大小附近,内存占用206MB。

缩放情况下,205MB

5、40张图,没有缩放图情况下,每张图大小在5MB大小附近,内存占用290MB。

缩放情况下,占用内存290MB

6、50张图,没有缩放图情况下,每张图大小在5MB大小附近,内存占用402MB。

缩放情况下,占用内存403MB

测试页面,页面里边一次加载50张不同的图片,每张5M以上,查看浏览器的内存使用情况的更多相关文章
- 基于JQuery实现滚动到页面底端时自动加载更多信息
基于JQuery实现滚动到页面底端时自动加载更多信息 关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = par ...
- 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法 一.CSS和 ...
- 一个页面从输入URL到加载显示完成,发生了什么?
面试经典题--URL加载 一.涉及基本知识点: 1. 计算机网络 五层因特尔协议栈: 应用层(dns.http):DNS解析成IP并完成http请求发送: 传输层(tcp.udp):三次握手四次挥手模 ...
- chrome://inspect调试html页面空白,DOM无法加载的解决方案
chrome://inspect调试html页面空白,DOM无法加载的解决方案 先描述一下问题 有一段时间没碰huilder hybird app 开发了,今天调试的时候 chrome://inspe ...
- wp加载本地HTML(附带图片,CSS,JS)
wp加载本地HTML(附带图片,CSS,JS) Windows Phone:Load Local HTML with Img,Css,Js by 唐小崇 http://www.cnblogs.com/ ...
- 动态加载/删除css文件以及图片预加载
动态加载/删除css文件以及图片预加载 功能模块页面 最近,工作中遇到了一个比较奇葩的需求:要在一个页面(PC端)增加一个功能模块,但是这个页面在不久之后要重构,为了新增加的模块可以继续复用, ...
- RecyclerView加载更多用notifyDataSetChanged()刷新图片闪烁
首先来看看对比ListView看一下RecyclerView的Adapter主要增加了哪些方法: notifyItemChanged(int position) 更新列表position位置上的数据可 ...
- js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js的引用,在浏览器,或微信上访问经常会遇到文件改了,但就是没有更新的问题,使用此函数可以轻松解决缓存问题只需要把js的引用方式改为使用此函数加载即可 源码如下: /** * js动态加载js css ...
- jquery文档加载几种写法,图片加载写法
jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函 ...
随机推荐
- smarty模板基础3 *缓存数据*
缓存数据,这个并不是暂存的缓存,而是写入了内存的缓存 通过一个例子来书写:缓存数据 一.书写php和html页面的基本功能 既然是用smarty模板,那么前端和后端要分开写了 (1)php页面 < ...
- Java 大数A+B
public class Solution { public int length = 0; public Object[] numToArrays(int num) { List<Intege ...
- Triangle Problems
Triangle Problem songxiuhuan 宋修寰 Import the Junit and eclemma Choose the project and right click, ch ...
- cookie 详解 与 封装 实用的cookie
在WEB前端开发中,cookie是必不可少的,网上也有很多开源的库可以使用,不过我还是想自己总结一下,做个笔记并封装一个实用的库.(1)什么是cookie? 从web 角度 cookie是用于存储信息 ...
- 学习HTML5一周的收获1
HTML5的基本结构 学习了title标签(显示网站名称),link标签(链接文件,可做网页美化) 快捷键:Ctrl+/ 注释 学习[meta标签] 1.charset属性:单独使用,设置文档字符集编 ...
- linux yum下载文件的存放位置
默认是: /var/cache/yum也可以在 /etc/yum.conf 指定cachedir=/var/cache/yum #存放目录keepcache=1 #1为保存 0为不保存metadata ...
- sass 学习
本来看了阮一峰和于江水两位老师的博客,有看了ionic自带的sass文件,原以为自己已经是很熟悉,精通了.可是我居然连ruby都不知道真实惭愧啊,辛亏看了www.sass.hk 我想这篇官方文档肯定 ...
- 使用Android Studio导入第三方库项目
在使用Android Studio开发时,用到了第三方库SlidingMenu(现在已经不推荐使用了),尽管如此,但具体怎么导入第三方库还是需要知道的,在查阅各种资料后,知道了一种比较容易可行的方法 ...
- linux下大于2T的硬盘格式化方法
我们先在超级用户模式下用fdisk -l命令查看挂载的硬盘设备,假设设备号为/dev/sdb,接下来我们使用parted命令来进行GPT分区:1. yum install parted -y# par ...
- Myeclipse Java项目转换成Maven项目
1.在Eclipse中Java项目转换成Maven项目可以在项目右键-->configure-->Convert Plug-in projects.. 就可以.而在myeclipse中项 ...