测试页面

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内核在这个缩放上的算法已经优化。

 

320张图,没有缩放图情况下,每张图大小分布在5MB以上,内存占用149MB

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

缩放照片会增加内存消耗,webkit内核在这个缩放上的算法已经优化。

 

430张图,没有缩放图情况下,每张图大小分布在5MB大小附近,内存占用206MB

缩放情况下,205MB

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

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

650张图,没有缩放图情况下,每张图大小在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. 利用smarty模板(登录、有关信息操作等功能)

    smarty模板前提是:前端和后端是分开的,所以肯定会有很多的后台页面,php页面和html页面是分开存储的. (1)登录页面的编写也是分两个页面(后台和前端) 1.首先是后台的php页面,很简单只要 ...

  2. Yii地址美化(nginx环境)

    通过urlmanager实现yii地址美化,需配合服务器中的rewrite配置     1.在'components'中加入    'urlManager'=>array(        'ur ...

  3. MDX 用Ancestors得到Hierarchy中指定Level的值(附带SCOPE用法之一)

    需求:用户想要用Excel,对比每月预算和整年预算,需要在两个用户定义的Hierarchy都可以浏览.财年季月日(FYQMD)和财年月日(FYMD). 自定义hierarchy 属性关系(Attrib ...

  4. 算法模板——splay区间反转 2

    实现功能:同splay区间反转 1(基于BZOJ3223 文艺平衡树) 这次改用了一个全新的模板(HansBug:琢磨了我大半天啊有木有),大大简化了程序,同时对于splay的功能也有所完善 这里面没 ...

  5. 算法模板——Trie树

    实现功能——实现对于不同字符串以及之前出现过的字符串的识别,对于单个长度为L的字符串,复杂度为O(L); 代码不难懂,直接上(在识别字符串方面,个人觉得其好处远远大于hash识别——1.理论上都是O( ...

  6. requireJS的配置心得

    1.html页面中如果同时存在data-main和require()和配置(config中的baseUrl),那么定义根路径 baseUrl > data-main > index.htm ...

  7. java 学习 todoList

    1.并发包的使用 2.线程相关的源码,怎么结束一个线程 3.单例模式代码 4.mixin 相关的理解代码 书单: effective java java 编程思想 spring 编程指南 深入理解jv ...

  8. Spring:利用PerformanceMonitorInterceptor来协助应用性能优化

    前段时间对公司产品做性能优化,如果单依赖于测试,进度就会很慢.所以就通过对代码的方式来完成,并以此来加快项目进度.具体的执行方案自然就是要知道各个业务执行时间,针对业务来进行优化. 因为项目中使用了S ...

  9. 【笔记】归纳js getcomputedStyle, currentStyle 以及其相关用法

      好吧,鉴于前端则个行业知识宽度广而深,早期看过高程介绍过的获取元素计算后的最终样式(浏览器显示的最终样式)的方法现在也忘得七七八八了 于是百度了一下,看了一下大神张鑫旭的博客,这里写个随笔记录一下 ...

  10. 腾讯云数据库团队:PostgreSQL TOAST技术理解

    作者介绍:胡彬 腾讯云高级工程师 TOAST是"The Oversized-Attribute Storage Technique"的缩写,主要用于存储一个大字段的值.要理解TOA ...