Используйте php для загрузки изображений и минимизации HTTP-запросов.

Question

Цель: свести к минимуму время загрузки моего веб-сайта.

Я провел много проверок и тестов скорости.

Все они указывают на то, что много времени тратится бесполезно, ожидая ответа HTTP , Время, потраченное на фактическую отправку данных, очень мало по сравнению с этим.

Снимок экрана "теста скорости":

Итак, я начал загружать все сценарии и стили в PHP и просто повторял их:

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

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

Это работает, однако изображения все еще немного замедляют работу. Как мне использовать php, чтобы читать их и отображать их как тег <img>?

(упомянутый веб-сайт https://www.finnmglas.com/)

Answer 1

Я заметил такую ​​же проблему ожидания и задержки ...

Есть много факторов, местоположение сервера, местоположение посетителя (в случае picscreen; местоположение сервера, который сделал тест), маршрутизаторы между провайдером inte rnet и др. c ...

Я обнаружил, что использование CDN намного лучше, браузер будет подключаться к CDN, имеющему множество серверов по всему миру. затем cloudflare запрашивает у вашего сервера и кэширует HTML, js, css, изображения, видео ... так что доставка до конечной точки становится намного быстрее

вы можете попробовать https://www.cloudflare.com/

Answer 2

Да, вы можете добавить данные вместо URL в атрибут src:

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

, но я рекомендую это для небольших изображений. Лучший способ для более мелких изображений - использовать его в качестве спрайтов: https://www.toptal.com/developers/css/sprite-generator/

и для CSS / javascript использовать препроцессор minify: gulp gulp-clean-css gulp-uglify-es