微信号:infoqchina

介绍:有内容的技术社区媒体

每秒对外提供10万张照片技术栈揭密;前端工具使用情况调查提供社区洞察力

2015-09-30 08:08 Q新闻

1
Imgix技术栈揭密
如何实现每秒对外提供10万张图片


什么是Imgix?


Imgix是一项进行图像实时处理和传输的服务,授权给企业和开发者用以优化图像。借助简单的URL API接口,Imgix可以实时抓取、传输图像,并通过CDN将图像提供到世界各地。个人用户在使用时可以无限量地动态生成图像,从而不必在本地储存大量的图像。图像剪裁、大小调整等动态调整过程防止了网页过于臃肿,保证了网站精炼简洁。

挑战技术


Imgix拥有超过80个URL参数,这些参数用于调整复杂的图像处理效果。Imgix可以调节压缩比和色度抽样率,进行色彩量化等操作。另外, Imgix能够同时响应多个输入,输入图像的来源(浏览器、手机、平板电脑、显示器)也可不同。目前,影响图像输出结果的参数和输入的绝对数目仍在快速增长。


设计Imgix架构时的前提假设是,收到的图像请求不能被缓存,而且必须动态创建。这一点彻底改变了Imgix服务的提供方式和评判标准。多年来,Imgix架构被反复修改,现在已经能够做到每秒处理超过10万个的图像,其中90%的输入文件大小大于4.5MB。Imgix用最快的速度、最少的成本提供了质量最好的图像。未来,Imgix还希望把每秒处理的图像数量提高到100万个以上。

技术栈揭秘


Imgix的核心架构由多个服务层组成,包括原图抓取层、原图缓存层、图像处理层、负载平衡及分配层、以及内容传输层。每个服务层都有遍布全局的配置、日志记录、监视及管理服务。


原图抓取层和缓存层使用了定制的MogileFS、nginx、HAProxy作为底层技术。负载平衡及分配层则基于自定义C代码和自主开发的LuaJIT框架(名称为Levee)。Levee能够在一台机器上每秒处理4万个请求。将以前的一些由Python处理的服务转为用LuaJIT框架处理后,性能提高了20倍。当技术成熟之后,Levee还将开源。网络边界管理则同时使用了HAProxy、nginx和OpenResty。图像处理层的高性能图像处理服务器使用C、Objective-C以及Core Graphics搭建。在GPU中的图像处理操作时间小于1ms,提升性能的工作主要是对网络接口/本地内存的缓存到GPU纹理缓冲器这一步进行路径优化。由于图像完全契合GPU纹理缓冲器,点对点处理时间的范围小于50ms。图像处理层的所有更改都将进行一系列回归分析测试,以保证每次更改不会对图像处理结果引入视觉可辨的差异。最后的内容传输层使用了Fastly,通过Vanish工具进一步优化了流量控制。全球20多个Fastly POP使得Imgix的用户可以快速获取图像。各个服务层之间的有序协作将90%首次抓取、未经缓存的图像在高峰时期的点对点响应时间缩短到了700ms以下。


Imgix每个服务层的日志记录十分重要,因此需要建立全面的日志生成流水线。Heka用于处理大部分数据行集合,并将处理后的实时数据、统计数据、分析数据分别发送给Riemann、Hosted Graphite和Google BigQuery。


Imgix管理和监控堆栈使用了几项开源项目:Ansible用于配置管理,Consul用于服务发现,Prometheus用于网络监控,StatusPage.io用于给用户报告架构当前的状态。


Imgix网页的前端服务完全与核心架构隔离。页面搭建主要根据需求使用Angular、Ember或Tornado,这些工具提供了配置及管理Imgix账户的网页接口。Imgix还分别为每一个前端项目的开发、测试、制作提供了Docker容器。另外还有CircleCI用于内部服务,Travis CI 用于管理开源项目和库。


Imgix不断地整合集成,一天内常进行多次部署。Imgix的开发使用GitHub管理每项服务的代码仓库,使用Trello作为团队规划管理工具。项目讨论在Slack群组聊天软件上进行,不过更多的时候,讨论直接就茶水间中完成了。


2013年,苹果公司发布了更符合Imgix需求的硬件设备——Mac Pro。现在,Imgix的数据中心用46U机柜搭建了Mac Pro图像处理节点群。这种机柜整合方式比起大多数基于Linux的解决方案,大大节约了占地面积,减少了耗电量。Imgix宣称其从内而外都优于运行在EC2上的ImageMagick。


2
社区洞察力
前端工具使用状况调查


Ashley Nolan对开发者前端工具的选择进行了一次调查,超过1000名开发者对此进行了回应。调查结果发布在“2015年前端工具使用状况”一文中,并且Ashley Nolan的分析为“2015年JavaScript状况”提供了另一种视角。


一个经常被问到的问题是:“我应该使用什么样的框架?”虽然Angular在过去的几年中获得了广泛的关注,但是如今React出现了。该调查询问开发者:“在你们的项目中,主要使用哪种JavaScript库或者框架?”虽然调查发现jQuery可能已经达到其顶峰,并且超过55%的项目仍然在使用jQuery,但是仍然有15%的受访者表示他们主要使用Angular和8%的受访者表示他们主要使用React。


Nolan的调查结果显示Angular和React的使用比例为2:1,这跟InfoQ最近一次发起的“现实中JavaScript框架使用调查”结果不谋而合。


至于任务运行器,调查结果显示Gulp遥遥领先于Grunt。Nolan告诉InfoQ,这样的结果让他大吃一惊:


我觉得Gulp会做的跟我想象中一样的出色,因为他已经彻底缩小了跟Grunt的差距,但是我没想到它是如此的出类拔萃,以至于独占鳌头。我认为这显示了,在较长时期内,如果人们看到转换前端工具所带来的价值时,他们是多么地愿意转换前端工具的,并且现在人们就是这么做的。




该图已经得到Ashley Nolan的许可。


该调查同样显示大部分开发者并没有关注JavaScript测试。超过56%的受访者表示他们没有使用任何一种工具来测试他们的JavaScript。而Mocha和Jasmine是那些开发者用来测试他们的JavaScript最常用的两种工具。Nolan向InfoQ暗示到:目光短浅可能是他们不使用测试工具的原因。


他认为尽管社区已经多次强调了JS测试的重要性,但是真正让你开始考虑着手建立时,它仍然是众多比较困难的领域之一——因为与学习一个新的JavaScript框架或者任一前端开发的新领域相比他们需要投入精力到学习某一测试框架里去,但是并不是所有开发者都能看到学习新的测试框架的价值所在。当给某些只看着底线而不顾全大局的管理者或者企业工作时,为学习和建立测试框架所花费的时间辩解是一项比较困难的工作。


理想情况下,为了挖掘这种趋势是如何随着时间推移而变化的,Nolan将会定期重复该项调查。他告诉InfoQ他比较有兴趣看到PostCSS的兴起,“因为目前PostCSS在行业有很大的使用它的动能,并且它让开发者在CSS处理方面拥有更多的主动性”。


版权归属InfoQ,禁止私自抄袭转载。

回复关键词React | 架构师 | 运维 | 云 | 开源 | 物联网 | Kubernetes | 架构 | 人工智能 | Kafka | Docker | Netty | CoreOS | QCon | Github | Swift | 敏捷 | 语言 | 程序员


今日文章推荐


解析Twitter如何构建高性能分布式日志

Airbnb副总裁分享Airbnb的架构要点

为什么你的软件项目会失败?

投稿可勾搭:

邮箱:editors@cn.infoq.com

合作QQ:1073600161

 
InfoQ 更多文章 Facebook如何实现PB级别数据库自动化备份 学术派Google软件工程师Matt Welsh谈移动开发趋势 Spotify为什么要使用一些“无聊”的技术? 妹纸们放假了,汉纸们做啥? 大多数重构可以避免
猜您喜欢 一篇短文,看完再睡 从小飞侠到黑曼巴,科比成王之路不亚于一次伟大的创业 运行iOS 8的“iPhone 6/6c”来了 【跟着妹子学编程】第十讲,PHP教程 Android Studio 2.0,先睹为快吧