0

Ребят, знаю что здесь вопросы подобного рода не приветствуются, но все же вынужден попросить вас о помощи. Есть сайт. Есть страница приложения (такого типа страница) и грузится она достаточно долго. По данным разных сервисов от 3,5 до 13 секунд.

Все js- и css-файлы минимизируются и компилятся в один. По изображениям - буду использовать lazy-load. Есть ли какие-либо еще предложения по оптимизации скорости загрузки?

2

1 ответ 1

2
  1. Разместите шрифты локально, у себя на сервере.
  2. Картинки у вас 110х110, а на сервере лежат 120х120.
  3. Используйте прогрессивный jpg.
  4. Размеры изображений не указаны ни в css, ни в html
  5. Используйте методику Critical Path css.
  6. Разделите js на два файла, тот который нужен для отображения страницы и тот, который можно загрузить позднее.
  7. Используйте inline svg вместо отдельных файлов.

Основное время вы тратите на загрузку миллиона картинок. При этом в верхней 1000px картинок не так много. В общем нужно в начале бросить все силы на то, что бы показать сайт посетителю как можно быстрее, системными шрифтами, убого, топорно, но показать. А потом в фоне подгружать все плюшки.

Простите если ничего нового не сказал...

6
  • 1. Внешнее подключение шрифтов обусловлено двумя причинами. Во-первых, Roboto и Roboto Slab весьма распространены и вероятность того что они подгрузятся кэшем очень большая. А во-вторых, подключая их локально, я не знаю почему, но они "плывут". Вот просто тупо блюрятся и все тут..
    – Игорь
    23 мар 2017 в 20:12
  • 2. По изображениям - тут я буду использовать lazy-load, т.е. картинки будут подгружаться при доскролле, а не сразу после загрузки страницы.
    – Игорь
    23 мар 2017 в 20:15
  • 7. Можно подробней про inline svg? Буду оч благодарен за ссылку
    – Игорь
    23 мар 2017 в 20:18
  • 1. А как вы подключаете? Нужно воспользоваться одним из сервисов рендера веб-шрифтов, типа fontsquirrel. Если вы подключите их локально, то они ТОЧНО закешируются. К тому же вы в курсе что гугла вы грузите не только ext наборы, но и греческие, вьетнамские шрифты? 23 мар 2017 в 21:44
  • 7. Ну а куда подробнее то? В html вставляете через тег svg, в css через base64. Все для того чтобы избавится от загрузки лишнего файла. 23 мар 2017 в 21:46

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.