python - 模糊图像服务器端或使用 CSS

Question

我有一个网站，其中包含用户上传的图片，这些图片使用以下 CSS 进行了模糊处理:

.blur {
  -webkit-filter:blur(40px);
  filter:blur(40px);
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='40')
}

然而，很少有人支持 seen here .

允许它在所有浏览器上工作的一种方法是模糊图像服务器端(我将 Python 与 Flask 结合使用，因此我可以使用 pill Python 库，对其进行模糊处理，然后保存该图像。)

但是，使用它也有缺点，例如存储成本更高。

那么，我应该模糊服务器端的图像还是有 CSS 解决方法？谢谢。

Answer 1

我知道这是一个老问题，但它出现在我的搜索中。对于其他研究此问题的人来说，需要考虑的一件事是用 40 像素的半径进行模糊所需的客户端处理器开销。我正在构建一个在固定背景上模糊滚动部分的页面(这是为了视觉效果，而不是为了模糊内容/安全性)，并且在滚动时，我的 CPU 使用率异常高。这导致最近型号的笔记本电脑出现明显的延迟。我最终使用服务器端预模糊图像而不是 CSS 过滤器，滚动页面时的 CPU 使用率大大降低。

一般来说，正如@taesu 指出的那样，像这样的视觉效果通常最好使用 CSS 来完成，但请确保您不会招致对用户体验产生负面影响的性能损失。