加速的关键,不是降低重量,而是减少个数。如果重量在200K以内,只要网络不是特别慢,效率都差不多。但是,如果图片个数多一倍,效率将明显低一个档次。
传统切图讲究精细,图片规格越小越好,重量越小越好,其实规格大小无所谓,计算机统一都按Byte计算。客户端每显示一张图片都会向服务器发送请求,所以,图片越多请求次数越多,造成延迟的可能性也就越大。因为一张图片的传输时间,通常远小于请求等待的时间。
减少图片的三个技巧(CSS Sprite):
1. 图片限制(Image Slicing)
典型如文本编辑器,小图标特别多,打开时一张张跑出来,给用户的感觉很不好。如果用一张图解决,则不会有这个问题,比如百度空间、163博客、Gmail都是这么做的。
Image Slicing’s Kiss of Death
http://www.alistapart.com/articles/sprites
2. 单图转滚(Single-image Rollovers)
触发切换图片的需求,传统方案得重新请求新图片,因为网络问题经常造成停留或等待。如果把多种状态合并成一张图,就能完美解决,然后再使用背景图技术模拟动态效果。
ColorScheme Ratings
http://demo.rexsong.com/200608/colorscheme_ratings/
3. 延长背景(Extend Background Image)
如果图片的某边可以背景平铺无限延长,则不需要每个角、每条边单独搞出来,图片能少一个就少一个。其实,这个理论还可以扩展到四角容器里,好处是能大大简化HTML Structure。
Extend Background Image
http://demo.rexsong.com/200705/extend_background_image/
综合案例
Google Korea(1和2技巧)
http://demo.rexsong.com/200705/google_korea/
CSS Menus(2和3技巧)
http://demo.rexsong.com/200705/css_background_menus/
分享到:
相关推荐
本程序基于OpenCv2.4.4和VS2010,本人也是初学者,不保证在其他的OpenCv和VS版本下本程序也能正常运行。
对DR(digtal radiography,数字辐射成像)图像进行分割是工业DR图像处理中一项重要内容。...对实际工业DR图像分割实验结果显示,该方法加速比可达到32到44倍,表明使用CUDA并行化C-V方法分割DR图像高效可行。
GitHub最新hosts。解决GitHub图片无法显示,加速GitHub网页浏览。
通过固定的协议串口发送数据,在pCduan 上位机显示出加速计,陀螺仪以及姿态结算的角度曲线,可以生成实时3d图像,里面是上位机应用程序
在opencv读取的图片,转化为gpumat,用opengl绘制,并在图片上绘制矩形。使用cuda加速。
OpenMP OpenCV 显示Mandelbrot图像,采用通用加速技术显示Mandelbrot图像
直接将第三方外链图片地址显示为图片、支持多种缓存方式,可有效破J图片防盗链功能。 API上传接口 通过API上传接口可以将本地图片上传至呆错免费图床并以JSON格式返回图片的真实地址。 API转换接口 通过API转换接口...
1、js向flash cs3传递参数并显示出来,4张图片切换方式为左右加速滚动 ,传递的参数为,宽度、高度、图片路径、图片链接、图片标题 2、用as3.0方式编写 3、解决了其他flash切换时,下方的图片标题显示不正常,或者...
DICOM医学图像窗口变换的加速算法,详细的描述了dicom的图像的处理方式,使图片可以更加突出的显示需要显示的部分,而将不需要的部分过滤掉
研究论文-利用MFC实现双缓存机制改善图形的显示效果
1.1:图像加载、显示 利用图像库的功能,实现从文件加载图像,并在窗口中进行显示的功能;利用常见的图像文件格式(.jpg; .png; .bmp; .gif)进行测试; 1.2:图像合成 现有一张4通道透明图像a.png: 从其中提取出...
GD32F450的TLI接口具备了多层显示能力,可以支持两个独立的显示层,并支持层窗口和层混叠。
图像显示器件是二维光信号的图像与人的视觉之间的媒介。图像具有丰富的信息量,伴随着图像的发射、传输、接收的国际化,电子图像显示器件将会起到越来越重要的作用。目前,电子图像显示器件主要有阴极射线管CRT显示...
GitHub最新hosts。解决GitHub图片无法显示,加速GitHub网页浏览。
图像显示器件是二维光信号的图像与人的视觉之间的媒介。图像具有丰富的信息量,伴随着图像的发射、传输、接收的国际化,电子图像显示器件将会起到越来越重要的作用。目前,电子图像显示器件主要有阴极射线管CRT显示...
在google中搜索一下css sprites这个名称,会查出很多信息,并且随着SEO越来越被人们重视,采用这种技术来进行图片优化的网站越来越多,国内几家大型门户网站无不仿效。如新浪,网易,搜狐。... 加速图片显示
9.内置海外服务器加速,加速远程桌面和ssh连接,操作流畅无卡顿. 10.内存,Cpu性能监控,Ping延迟丢包,Trace路由监控. 11.实时硬盘监控. 12.进程管理器. 13.快捷命令面板,可同时显示数十个命令. 14.内置文本编辑器,支持...
该方案旨在建立一套具有视频播放,图片、文字显示,支持多区域显示和流媒体播放,支持高分辨率的全彩LED屏幕的小型播放系统。系统硬件部分采用了S3C2440作为处理核心,并且使用嵌入式显示芯片SM501提供2D图形硬件...
在 Windows 10 系统中,为了加速图标的显示,当第一次对图标进行显示时,系统会对文件或程序的图标进行缓存。 . 之后,当我们再次显示该图标时,系统会直接从缓存中读取数据,从而大大加快显示速度。
第四章 案例1图像的局部放大 案例2浮雕方式显示图像 案例3任意角度...图片 案例11图像的黑白化显示 案例12播放WAV文件 案例13如何播放视频文件 案例14使用双内存加速图像重画 案例15创建缩略图...