Использовать React JS или нет для - Неинтерактивная страница с изображениями, загруженными из базы данных?

Question

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

В настоящее время загрузка страницы занимает около 5 секунд.Эта страница в настоящее время создана в шаблоне ERB для ruby ​​и работает на рельсах.

Мы хотим увеличить скорость загрузки.

Будет ли использование React JS в качестве внешнего интерфейса сокращать время загрузки страницы?Если нет, то какова другая альтернатива?

Answer 1

Я бы предложил использовать корзину Amazon S3 для хранения ваших изображений и внедрить AWS CDN Cloudfront, чтобы кэшировать ваш контент ближе к пользователям.

Я бы также добавил, что время загрузки 5 с почти наверняка не связано с вашей платформой и скорее связано с аппаратным обеспечением.

Вы также можете рассмотреть возможность предварительной загрузки изображений.

Answer 2

Добавление любой библиотеки замедлит страницу (немного), если предположить, что вы используете ванильный Javascript на этом этапе. Если вам просто нужно создать сетку изображений на странице, которая соответствует размеру страницы, я бы просто использовал ванильный Javascript и сетку Bootstrap css. Проверьте свои инструменты разработчика, чтобы узнать, сколько времени занимает фактический запрос к бэкэнду. Вероятно, причина, по которой ваша страница медленная, в том, что вы возвращаете фактические изображения (большой объем данных!) Из базы данных / API (в зависимости от вашего бэкенда). setup) запрос вместо ссылок на изображения, где они обслуживаются.

Answer 3

Скорее всего вам не нужно реагировать.

Вероятно, причиной медленности является размер изображения. Вы можете либо попытаться оптимизировать изображения для Интернета (например, с помощью WebP: https://developers.google.com/speed/webp/ и https://css -tricks.com / using-webp-images / ), либо использовать отложенную загрузку, для пример: https://github.com/verlok/lazyload.

Чтобы выяснить, почему страница медленная, вы можете использовать Chrome или Firefox devtools waterfall или, для более глубокого понимания, в Google Chrome есть пункт «Аудиты» в разделе devtools.

Я бы начал с водопада devtools на вкладке Сеть.

Answer 4

Если вам нужно использовать самый быстрый JS Framework, попробуйте Vanilla JS. Определенно быстрее, чем React и Angular