亚马逊s3 cdn

Cloud storage offers companies many benefits like redundancy and lower costs. All the big cloud providers have their own version of cloud storage. Launched as early as 2006, Amazon S3 is one of the more popular cloud storage services. S3 (Simple Storage Service) is very convenient for storing all sorts of website files. In addition to dumping log data there, site owners frequently store web content like images on S3, and in turn, display the images on a website.

云存储为公司提供了许多好处,例如冗余和更低的成本。 所有大型云提供商都拥有自己的云存储版本。 Amazon S3最早于2006年推出,是最受欢迎的云存储服务之一。 S3(简单存储服务)对于存储各种网站文件非常方便。 除了将日志数据转储到那里之外,站点所有者还经常将Web内容(如图像)存储在S3上,然后将这些图像显示在网站上。

In fact, according to the public data set HTTParchive available in Google Bigquery, more than 10% of the websites use S3 as image storage. Most of these have a general-purpose CDN in front. However, almost 20% of the websites that use S3 as image storage serve images straight from S3 without a CDN in front.

实际上,根据Google Bigquery中可用的公共数据集HTTParchive的数据,超过10%的网站使用S3作为图像存储。 其中大多数在前面都有通用CDN。 但是,几乎有20%的使用S3作为图像存储的网站直接从S3提供图像,而前面没有CDN。

Amazon S3速度慢且图像重 ( Amazon S3 is Slow and Images are Heavy )

Amazon S3 is known to be slow when serving web content directly. One reason why it is slow is that a bucket is only located in one geographical location. The location is selected when you create the bucket. For example, if your bucket is created on Amazon servers in California, but your users are in India, then images will still be served from California. This geographical distance causes slow image loading on your website.

直接提供Web内容时,Amazon S3速度较慢。 速度较慢的原因之一是存储桶仅位于一个地理位置。 创建存储桶时会选择该位置。 例如,如果您的存储桶是在加利福尼亚州的Amazon服务器上创建的,但您的用户在印度,则仍将从加利福尼亚州提供图像。 此地理距离会导致您的网站上的图片加载缓慢。

Further, it is not uncommon to see very heavy images on S3, with large dimensions and high byte size. One can only speculate on the reasons, but it is probably related to the publication workflow and the convenience of S3 as a storage space.

此外,在S3上看到非常重的图像并具有大尺寸和高字节大小的情况并不少见。 只能推测原因,但这可能与发布工作流程以及S3作为存储空间的便利性有关。

Let’s see how we can accelerate image delivery while keeping S3’s workflow and convenience level.

让我们看看如何在保持S3的工作流程和便利性的同时加快图像的交付。

加快S3上的图像传送 ( Speeding Up Image Delivery on S3 )

To catch the two flies of global distribution and image optimization at once, let's see how an image CDN like ImageEngine can leverage S3 as an origin.

为了同时捕捉到全局分布和图像优化这两个方面,让我们看看像ImageEngine这样图像CDN如何利用S3作为原点。

Step1: Create the S3 bucket

步骤1:创建S3存储桶

Once logged in to the Amazon console it is easy to create the bucket and store content in it. By default buckets are private. In order for the Image CDN to reach the origin image, we must create a bucket policy to make the contents of the bucket available on the web.

登录到Amazon控制台后,可以轻松创建存储桶并将内容存储在其中。 默认情况下,存储桶是私有的。 为了使Image CDN到达原始图像,我们必须创建一个存储桶策略,以使存储桶的内容在Web上可用。

Once you’ve implemented the policy that fits your needs, the bucket should be available in your browser using this scheme for a hostname:

一旦实施了适合您需求的策略,就可以使用以下方案为您的主机名在您的浏览器中使用存储桶:

https://<bucket>.s3.amazonaws.com/<file>

Alternatively:

或者:

https://s3-<location>.amazonaws.com/<bucket>/<file>

For example: http://s3.eu-west-3.amazonaws.com/my.image.store/athlete-tying-running-shoes.jpg

例如: http : //s3.eu-west-3.amazonaws.com/my.image.store/athlete-tying-running-shoes.jpg

Or

要么

http://my.image.store.s3.amazonaws.com/athlete-tying-running-shoes.jpg

http://my.image.store.s3.amazonaws.com/athlete-tying-running-shoes.jpg

Step 2: Sign up for an ImageEngine account.

第2步:注册一个ImageEngine帐户。

ImageEngine offers free trial accounts with no strings attached. The signup process will ask for a nickname for the account, a domain name intended for serving images, and an origin location.

ImageEngine提供免费试用帐户 ,不附加任何字符串。 注册过程将要求该帐户的昵称,用于提供图片的域名以及原始位置。

Give the account a name you like and provide a domain name you think you’ll be using to serve images on your web site. This can, of course, be changed later. In our case, we choose “s3img.mydomain.com”.

给帐户指定一个您喜欢的名称,并提供一个您认为用来在网站上提供图片的域名。 当然,以后可以更改。 在本例中,我们选择“ s3img.mydomain.com”。

The origin is the S3 bucket we created in step 1. There are two ways to configure the S3 bucket. You can use the S3 protocol or HTTP.

源是我们在步骤1中创建的S3存储桶。有两种配置S3存储桶的方法。 您可以使用S3协议或HTTP。

If you want to use the S3 protocol, check the S3 radio button and type the name of the bucket.

如果要使用S3协议,请选中S3单选按钮并键入存储桶的名称。

alt_text

If you want to use HTTP, then select the HTTP radio button and type in the fully qualified hostname. Note that if you want HTTPS, you’ll need to use the notation with the bucket name in the path: s3-.amazonaws.com. Submit the hostname for now, and you can edit the origin later and add the bucket name.

如果要使用HTTP,请选择HTTP单选按钮并键入标准主机名。 请注意,如果要使用HTTPS,则需要在路径s3-.amazonaws.com中使用带有存储区名称的表示法。 现在提交主机名,以后您可以编辑来源并添加存储桶名称。

On the question “Allow origin prefixing” it is safe to answer “No” for now. Hit submit and the account is created.

关于“允许来源前缀”问题,现在可以安全地回答“否”。 点击提交,创建帐户。

Step 3: Configure your DNS

步骤3:配置您的DNS

This step is not strictly necessary, but if you want to serve images from the domain name provided in step1 you’ll need to add a CNAME record in the DNS. The DNS info needed is presented to you when submitting the form in step 2.

此步骤并非绝对必要,但是如果您要使用步骤1中提供的域名提供图片,则需要在DNS中添加CNAME记录。 在步骤2中提交表单时,会向您提供所需的DNS信息。

Record Name: s3img.mydomain.com
Record Type: CNAME
Record Value: s3img.mydomain.com.imgeng.in

Note that the Record Value can also be used to access images on S3:

请注意,记录值也可以用于访问S3上的图像:

http://s3img.mydomain.com.imgeng.in/gentlemans-fashion-flatlay.jpg

http://s3img.mydomain.com.imgeng.in/gentlemans-fashion-flatlay.jpg

Step 4: tune settings

步骤4:调整设定

In less than 5 minutes, the S3 bucket is configured, the ImageEngine account is created and ImageEngine is serving optimized images from S3. You can also log in to the ImageEngine dashboard to manage multiple domain names and origins. Also in the dashboard you can tune the default behaviour of ImageEngine. For example tune the image quality, size, formats and so on.

在不到5分钟的时间内,配置了S3存储桶,创建了ImageEngine帐户,并且ImageEngine正在提供来自S3的优化图像。 您也可以登录ImageEngine仪表板来管理多个域名和来源。 此外,您还可以在信息中心中调整ImageEngine的默认行为。 例如,调整图像质量,大小,格式等。

ImageEngine使Amazon S3更快 ( ImageEngine Makes Amazon S3 Faster )

By these simple steps, images stored on Amazon S3 are now globally distributed and optimized by ImageEngine. If you want more information about the optimization process and the resulting next-gen file formats, then you can read about them here.

通过这些简单的步骤,现在可以通过ImageEngine在Amazon S3上全局存储和优化图像。 如果您想了解有关优化过程和生成的下一代文件格式的更多信息,那么可以在此处阅读有关它们的信息

To analyse the impact of ImageEngine we took a representative sample of the sites in the HTTParchive data set which store images on S3 and ran them through the ImageEngine demo tool, comparing original and optimized web site performance.

为了分析ImageEngine的影响,我们对HTTParchive数据集中的站点进行了代表性采样,这些站点将图像存储在S3上,并通过ImageEngine演示工具运行它们,比较了原始站点和优化的站点性能。

减少图像有效负载 (Reduced Image Payload)

Looking at the optimization aspect isolated, the savings in bytes are dramatic! The average byte size of an original image stored on Amazon S3 is 2.9MB, while the average optimized by ImageEngine is only 0.6MB. 78% less data! The dramatic savings suggest that a typical workflow involves storing images on Amazon S3 does not include any particular steps to reduce the file size before it is stored on S3.

看看孤立的优化方面,字节节省是巨大的! Amazon S3上存储的原始图像的平均字节大小为2.9MB,而ImageEngine优化的平均字节大小仅为0.6MB。 数据减少78%! 巨大的节省表明,涉及在Amazon S3上存储图像的典型工作流程在将文件存储到S3之前不包括任何减小文件大小的特定步骤。

The primary benefit is faster page loading for better user experience. Fewer data delivered also saves the end-users data plan as well as battery life because lighter images require less processing power to decode and display. Additionally, images will be displayed on the screen sooner freeing processing power to other tasks.

主要好处是页面加载速度更快,可以提供更好的用户体验。 传递的数据更少还节省了最终用户的数据计划以及电池寿命,因为较浅的图像需要较少的处理能力来进行解码和显示。 此外,图像将尽快显示在屏幕上,从而将处理能力释放给其他任务。

更快的页面加载 (Faster Page Load)

Fewer data to transmit over the wire also has a direct impact on the time it takes to display the page in the user’s browser. We’ve looked at the visual complete time; the time it takes for the page to be completely rendered visually in the browser.

通过有线传输的数据更少也直接影响在用户浏览器中显示页面所花费的时间。 我们已经看了视觉上的完整时间; 页面在浏览器中以可视方式完全呈现所花费的时间。

On average, the sample using ImageEngine is visually complete 3.4 seconds earlier than then sites with unoptimized images. 3.4 seconds is a huge improvement. Knowing that 53% of users leave the site if it takes more than 3 seconds to load,3.4 seconds improvement just by enabling ImageEngine is a giant leap towards the 3-second goal. Additionally, now that images are served from a CDN, not from a static S3 location, we get the advantage of global distribution and reduced latency.

平均而言,使用ImageEngine的样本在视觉上比未优化图像的站点要早3.4秒。 3.4秒是一个巨大的进步。 仅通过启用ImageEngine就知道有53%的用户离开网站,如果加载时间超过3秒 ,则改善了3.4秒,这是朝着3秒目标的巨大飞跃。 另外,由于图像是从CDN而不是从静态S3位置提供的,因此我们获得了全局分发和减少延迟的优势。

This is also why addressing images to improve performance, conversion rates and ultimately revenue is considered a low hanging fruit. Relatively little effort, but huge impact. Give ImageEngine a try!

这也是为什么解决图像问题以提高性能,转换率并最终获得收入的原因被认为是低落的果实。 相对较少的精力,但影响巨大。 试试ImageEngine

翻译自: https://scotch.io/tutorials/using-an-image-cdn-to-speed-up-image-delivery-from-amazon-s3

亚马逊s3 cdn

Logo

亚马逊云科技开发者 Build On 是由亚马逊团队策划、开发者社区联合打造的动手实操系列活动。

更多推荐