测试页面

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以上,查看浏览器的内存使用情况的更多相关文章

  1. 基于JQuery实现滚动到页面底端时自动加载更多信息

    基于JQuery实现滚动到页面底端时自动加载更多信息 关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = par ...

  2. 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存

    js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法   一.CSS和 ...

  3. 一个页面从输入URL到加载显示完成,发生了什么?

    面试经典题--URL加载 一.涉及基本知识点: 1. 计算机网络 五层因特尔协议栈: 应用层(dns.http):DNS解析成IP并完成http请求发送: 传输层(tcp.udp):三次握手四次挥手模 ...

  4. chrome://inspect调试html页面空白,DOM无法加载的解决方案

    chrome://inspect调试html页面空白,DOM无法加载的解决方案 先描述一下问题 有一段时间没碰huilder hybird app 开发了,今天调试的时候 chrome://inspe ...

  5. wp加载本地HTML(附带图片,CSS,JS)

    wp加载本地HTML(附带图片,CSS,JS) Windows Phone:Load Local HTML with Img,Css,Js by 唐小崇 http://www.cnblogs.com/ ...

  6. 动态加载/删除css文件以及图片预加载

    动态加载/删除css文件以及图片预加载   功能模块页面   最近,工作中遇到了一个比较奇葩的需求:要在一个页面(PC端)增加一个功能模块,但是这个页面在不久之后要重构,为了新增加的模块可以继续复用, ...

  7. RecyclerView加载更多用notifyDataSetChanged()刷新图片闪烁

    首先来看看对比ListView看一下RecyclerView的Adapter主要增加了哪些方法: notifyItemChanged(int position) 更新列表position位置上的数据可 ...

  8. js动态加载js css文件,可以配置文件后辍,防止浏览器缓存

    js的引用,在浏览器,或微信上访问经常会遇到文件改了,但就是没有更新的问题,使用此函数可以轻松解决缓存问题只需要把js的引用方式改为使用此函数加载即可 源码如下: /** * js动态加载js css ...

  9. jquery文档加载几种写法,图片加载写法

    jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函 ...

随机推荐

  1. jQuery_小测试

    1.在div元素中,包含了一个<span>元素,通过has选择器获取<div>元素中的<span>元素的语法是? 提示使用has() 2.在<ul>元素 ...

  2. bash之重定向

                                                                          标准输入 stdin:代码为0,使用< 或 <& ...

  3. js原生Ajax 的封装和原理

    原理及概念 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是一种用于创建快速动态网页的技术. 动态网页:是指可以通过服务器语言结合数 ...

  4. 南京.NET技术行业落地分享交流会圆满成功

    3月11日,由南京.NET社区发起,纳龙科技赞助,并联合举办的,.NET技术线下交流活动,圆满成功. 这是南京.NET圈子第一次的小型聚会,为了办好此次活动,工作人员不敢怠慢.早早准备好了小奖品与水果 ...

  5. [lua] 游戏客户端逻辑使用lua协程

    我们的游戏有这样一种情景:客户端中角色需要用到一些公会的数据,但服务器不会在玩家(创角后)一进入到游戏里就推送给玩家,而是需要客户端自己在需要的时候向服务器请求公会的数据,之前的实现就是在请求消息的时 ...

  6. ionic/cordvoa 修改platform文件夹里的文件,build会覆盖问题

    这个问题开始让我感觉很崩溃,然后,我也很意外,如果遇到可以试一试 情景: 编辑platform/android/build.gradle 看了一下cordova 命令,好像还没这个命令,但是我还真的执 ...

  7. 009 Java集合浅析4

    前面一篇教程中,我们分析了List派别中的最常见也最重要的一个类ArrayList<E>.从我们的分析来看,ArrayList作为动态数组的模拟,使用的是连续内存空间来存储数据,带来了可随 ...

  8. 温故而知新——map

    map  :关联式容器,使用时是以属性值对的方式进行使用,例如:<key,value>.map key值唯一,相同的key值插入时只会保留一个.除此之外,map的特点还包括:1.map底层 ...

  9. Lucas定理学习(进阶中)

    (1)Lucas定理:p为素数,则有: (2)证明: n=(ak...a2,a1,a0)p = (ak...a2,a1)p*p + a0 =  [n/p]*p+a0,m=[m/p]*p+b0其次,我们 ...

  10. STL部分的实现

    C++的STL很强大,里面实现很多功能 就平时经常会用到的vector之类的,自己实现一下, 有哪块错误的希望大神给予指点 vector类模板 template<typename T>cl ...