Я разрабатываю веб-сайт, и он почти размещен. Из-за низкой скорости загрузки страницы я проверил производительность скорости страницы моего веб-сайта через gtmetrix.com. Таким образом, его отчет вызывает две проблемы в качестве причин низкой скорости страницы.

Проблемы, влияющие на скорость загрузки страницы

• Объединяйте изображения с помощью спрайтов CSS

  Следующие изображения, предоставленные с abc.com, должны быть объединены в как можно меньше изображений с использованием спрайтов CSS.

  Объединение изображений в как можно меньшее количество файлов с использованием спрайтов CSS сокращает количество циклов и задержек при обработке. загрузки других ресурсов, снижает накладные расходы на запросы и может уменьшить общее количество байтов, загруженных веб-страницей.

• Укажите размеры изображения

  У следующих изображений отсутствуют атрибуты ширины и/или высоты.

  Указание ширины и высоты для всех изображений позволяет ускорить рендеринг, устраняя необходимость в ненужных перекомпоновках. и перекрашивает.

  ...abc.com/banner.jpg (Размеры: 512 x 33)

это водопад

Я в порядке со спрайтами CSS

Технические характеристики системы

• Ларавель 5.5
• Начальная загрузка 3.3.7

К изображениям, чтобы они реагировали, я добавил класс начальной загрузки

<img src = "../abc.com/banner.jpg" class = "img-responsive" alt = "Responsive image" id = "banner"> .

Поэтому я добавил пользовательский CSS к изображению с помощью id = "banner"

#banner{
  min-width : 512px ;
  min-height: 33px ;
}

Моя проблема в том, что когда я добавляю, что пользовательский веб-сайт css потерял свою отзывчивость.

Так может ли кто-нибудь помочь в этом. Я хочу указать размеры для изображений, а также он должен быть отзывчивым. Потому что это влияет на скорость моего веб-сайта.