使用 php 加载图像并最小化 HTTP 请求

Question

目标：最小化我网站的加载时间

我做了很多扫描和速度测试。

它们都表明，有很多时间无用地浪费在等待 HTTP 响应上。实际发送数据所花费的时间相比之下是非常少的。

屏幕截图 'speed test':

我开始加载 PHP 中的所有脚本和样式，然后只是回应它们：

<!-- loading a style -->
<style><?php echo file_get_contents("style.css"); ?></style>

<!-- loading a script (similar) -->
<script type="text/javascript"><?php echo file_get_contents("script.js"); ?></script>

这确实有效，但是，图像仍然会减慢速度。我如何使用 php 来阅读它们并将它们作为 <img> 标签回显？

(提到的网站是https://www.finnmglas.com/)

Answer 1

是的，您可以将数据 url 添加到 src 属性：

<img src="data:image/jpg;base64,<? php echo base64_encode($data) ?>" />

但我建议将其用于小图片。更多小图像的更好方法是将其用作精灵：https://www.toptal.com/developers/css/sprite-generator/

并为 css/javascript 使用一些缩小预处理器：gulp gulp-clean-css gulp-uglify-es

Answer 2

我注意到同样的等待和滞后问题...

有很多因素，服务器的位置、访问者的位置（在 picscreen 案例中；进行测试的服务器的位置）、互联网提供商之间的路由器等...

我发现使用 CDN 更好，浏览器会连接到世界上有很多服务器的 CDN，然后 cloudflare 询问你的服务器并缓存 HTML, js, css、图片、视频....让到达终点的速度变得更快

你可以试试https://www.cloudflare.com/

Answer 3

寻求答案的每个人：

您不应将带有 PHP 的图像回显到主文件中：

它扰乱了加载时间（使其变得更长）
并且它会延迟您网站的首次呈现。即使您的请求较少，您也会希望快速进行首次渲染（用户会注意到延迟）

从单独的 PHP 文件回显图像并包含指向该 PHP 的 <img> 标签应该不是问题 ^^

使用 php 加载图像并最小化 HTTP 请求

Use php to load images and minimize HTTP requests

php

image

httprequest

pagespeed