【原】一张图片优化5K的带宽成本

简介:

上周,我参加了公司的一门课程《网站性能优化》,讲师提出了一个问题:一张图片优化后减少5K,1年内可以大概省下多少宽带成本呢?非常好奇,仔细听完讲师分析,计算出来的数据让小伙伴们都惊呆了,仅仅5K,看起来真的没什么,一年内大概节省540元~1440元,这说明一个问题,用户数庞大的网站中,一点优化可能会带来巨大的带宽成本节省,表现出价值是特别高的,不容忽视小小优化带来的意义。相信很多同学也好奇这个数据是怎么计算的,公司的内部数据不好透露,给大家重新举个例子:

<!-- 
    公司内某个活动的最高峰半小时PV大概占总PV的3%,某天PV大概去到50万
    高峰期的半小时PV大概就是500000*0.03 = 15000,每秒PV是15000/1800 = 8.3(次每秒)(活动页面一般只访问一次,不考虑客户端缓存的情况)
    一张图片优化了5K,减少的宽带就是5*8.3 = 41.6kByte/s
    Byte是字节数,bit是位数,在计算机中每八位为一字节,也就是1Byte=8bit
    那么5K产生的带宽就是41.6*8/1024 = 0.325Mbit/s
    不同地区的IDC服务效果不同,价钱差异也比较大,每月100M大概在1万~2.68万不等(09年市场带宽成本价算的,数字不一定精准,但也是有力的数据)
   5K的图片所带来的0.325M带宽的成本,大概每月32.5元~87.1元
    那么,一年大概节省390元~1045元
-->

这个例子只是图片的优化,对于实际工作中,还有很多节省宽带成本的方法,如果要去算,那这个影响会放大10倍,100倍甚至是1000倍以上的数量级。网站性能的优化是一个一直不容忽视的话题,曾经写过《提高网站加载速度的3项黄金守则》一文,有兴趣可以了解下,平时多关心自己网站的性能优化,无形地为公司省钱,老板不止关心赚钱的事情,省钱的事情老板也会关注,如果你为老板省钱,说不定他一高兴就涨你工资了~

今天写这篇文章不止是想告诉大家小小优化带来的价值,另外给大家带来jpg图片的优化技巧,相信如何优化图片也是大家特别关心的问题。

实际运营的业务,很多图片存在被被忽视的优化,近期我在部门网站上下载了4张jpg广告图共300K+,这几张广告图上线前已被公司内部的优图工具压缩过,而我自己再通过软件进行二次压缩,保证图片质量良好下,优化后可以减少150K+,压缩率100%,那么,是什么软件压缩率这么好呢?

相信很多同学会猜想是我们非常熟悉的photoshop,ps的确是非常优秀的图像处理软件,基本上做web开发都会使用它,我们可以使用它压缩图片,效果也非常不错,以前我一直是使用它的存储为web格式的功能来压缩图片。今天介绍另一款图片处理软件,回顾博文《PNG的使用技巧》,推荐过大家在移动端使用PNG8 alpha格式,该格式不仅文件小,节省流量,而且半透明效果良好,而导出它的软件正是传说中fireworks,没错,就是它,强大的图片压缩软件,为网页设计而出生的作图软件, 是一款创建与优化 Web 图像和快速构建网站与 Web 界面原型的理想工具,我们来看实例~

保证图片质量良好的情况下,使用firework与photosop分别对jpg图片的进行,对比它们压缩率

下图是上上周上线的一张广告图:

图片大小96.3KB

1.用photoshop CS6压缩处理图片

按存储为web所有格式(CTRL+ALT+SHIFT+S),弹出如下界面,设置如下,优化后的图片大小为55.5K,减少了40.8K

 

2.用firework CS6压缩处理图片

 如下界面,在优化面板中选择:JPEG - 较高质量

 

使用导出功能来压缩图片,优化后的图片大小为49.2K,减少了47.1K

2者对比如下:

经过笔者多次尝试使用后,firework对图片(jpg、png、gif)压缩处理上比photoshop要优秀(例外:photoshop在png32的压缩处理稍微好点),关于png的压缩处理,可以参考《PNG的使用技巧》。强烈推荐大家使用firework,即便是Adobe公司在CC版本停止了firework,但相比其他图片处理软件,值得肯定的是,它的压缩图片功能(压缩图片的算法)是一流,未来我们还是可以继续使用。

话说回来,按照文章开头的计算,该广告图使用ps和fw压缩后可剩下多少钱多少流量呢,相信这也是一个惊人的数据,具体还跟页面的PV、广告的上下线时间等有关系。。

网站优化如此重要,我们可以做的还有很多,今天你优化了吗?

 

作者:白树

出处:http://peunzhang.cnblogs.com/

目录
相关文章
|
6月前
|
人工智能 机器人 Serverless
魔搭大模型一键部署到阿里云函数计算,GPU 闲置计费功能可大幅降低开销
魔搭大模型一键部署到阿里云函数计算,GPU 闲置计费功能可大幅降低开销
752 2
|
6月前
|
安全 Serverless API
Serverless架构在图像处理中展现出高成本效益,按需付费降低费用,动态调整资源避免浪费
【5月更文挑战第16天】Serverless架构在图像处理中展现出高成本效益,按需付费降低费用,动态调整资源避免浪费。其出色的并发处理能力和自动扩展确保高并发场景的顺利执行。简化开发流程,让开发者专注业务逻辑,同时提供丰富API和集成服务。安全方面,Serverless通过云服务商管理基础架构和多种安全机制保障任务安全。因此,Serverless是处理高并发、动态需求的理想选择,尤其适合图像处理领域。随着技术发展,其应用前景广阔。
70 4
|
开发工具
最低成本尝试做游戏的方式
如果说有 100 个人想过去做游戏的话,那么最终大概只有不到 20 个人真的去尝试了,这 20 个尝试的人里面,最终可能有两三个人真的做出了游戏,这个是尝试做游戏领域里的二八法则。 你或许就曾经有过想要做游戏的想法 ,之后因为各种各样的原因没有去尝试。回想那些我们曾经想要去做,但是最终却没有去做的事情,大部分的原因可能是因为做这件事情的成本太高。
123 0
|
编解码 运维 监控
轻松处理高于平常10倍的视频需求,还能节省60%的IT成本,蓝墨做对了什么?
如果说Serverless到底解决了什么问题,核心就是节约成本、节省精力。
3335 10
轻松处理高于平常10倍的视频需求,还能节省60%的IT成本,蓝墨做对了什么?
|
负载均衡 算法 Serverless
函数计算助力石墨文档突破性能瓶颈,有效节省58%服务器成本
石墨文档 是中国第一款支持云端协作的企业办公服务软件(功能类比于Google docs、Quip等),可以实现多成员多终端的在线实时协作,同步响应速度达到毫秒级,是团队协作的最佳选择。 石墨文档还是一款具有中国式美感的科技产品,2015 年获得极客公园最佳互联网创新产品 50 强。
4861 4
|
编解码 监控 Cloud Native
视频需求超平常数 10 倍,却节省了 60% 的 IT 成本投入是一种什么样的体验?
2020 年初,疫情期间,在线教育迎来需求爆发。为了应对高流量,蓝墨加大了整合业界优质课程资源的力度,不断拓展自身的业务边界,在赢得机遇的同时,技术团队也面临了前所未有的挑战。
视频需求超平常数 10 倍,却节省了 60% 的 IT 成本投入是一种什么样的体验?
|
前端开发 数据安全/隐私保护 缓存
低成本打造一个带宽无限的网站(三)
前端代理 HTML5 时代的黑科技层出不穷,但最具创新的也许要数 Service Worker,它甚至可以颠覆传统的 B/S 网络架构。 顾名思义,Service 是服务程序,而 Worker 常用于多线程。
1444 0
|
搜索推荐 SEO
如何增加网站流量 怎么快速增加网站流量的25种方法
如何提升网站流量?快速增加网站流量的25种方法 向营销人员或企业主询问他们在世界上最喜欢什么,他们可能会告诉你“更多客户”。经常出现在商家愿望清单上的顾客之后?他们网站的流量更多。有很多方法可以增加您网站的流量,在今天的帖子中,我们将查看其中的25个,包括几种免费提升网站流量的方法。
3615 0
下一篇
无影云桌面