加快图像繁重的Gatsby.js网站的部署和开发构建

Question

我正在使用Gatsby.js和gatsby-image建立一个网站，目前上面有300张图片。我遇到2个问题：

1. gatsby develop和gatsby build的运行时间很长，因为gatsby-image会生成多种分辨率并为网站上的每个图像生成svg占位符图像。一旦完成预优化，这将为用户带来出色的体验，但是如果我需要重新构建，则会带来非常缓慢的开发体验。

我目前的解决方法是在开发过程中删除除少数几个图像以外的所有图像。

1. 部署到GitHub Pages需要太多时间（包含300张基本图片* 3种分辨率+ 1个svg表示形式）。尝试将网站部署到GitHub页面会导致超时。尝试改为部署到Netlify，但我预计会有同样的问题。我也不想每次在网站上进行更改时都必须重新上传图像。

我不认为我的<1000张图像应该被认为是“图像过重”，但是由于上载速度差至中等，我需要一种增量地上传它们并且不重新上传未更改的图像的方法

。

有没有一种方法可以将图像与Gatsby网站的其余版本分开上传？

我认为也许我可以使用AWS S3，在创建新部署时手动选择要从我的构建文件夹中上传哪些文件。

还有其他人要处理大量图像的Gatsby网站吗？关于加快我的构建和部署过程的任何建议？

Answer 1

免责声明：我为Netlify工作

我们的一般建议是在本地进行图像优化，并将这些文件检入GitHub，因为它花费的时间比我们CI所允许的时间（15分钟）更长，而且重复性很强。

还有一个npm模块，该模块可让您缓存所做的工作以及相关性：https://www.npmjs.com/package/cache-me-outside可以为您完成这些操作而不会滥用GitHub（而不是滥用Netlify的缓存：））

Answer 2

请参见another answer from Netlify：较小的源图像（如@fool所述）或将其卸载到Cloudinary或Imgix之类的服务中。