0

Подскажите пожалуйста как правильнее сделать, ситуация такая:

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

——————

Есть компонент, для примера это будет меню с ссылками на страницы личного кабинета: настройки, выход и.т.д.

При клике на свою аватарку пользователю нужно показывать меню.

Вижу 3 варианта реализации этого функционала:

  1. Используя livewire. Плюс этого подхода в том что на странице изначально не будет лишнего компонента. Минус что нужно ждать его загрузку.

  2. Загрузить компонент на странице и показывать его через кастомную функцию на js.

  3. Загрузит и компонент и vue. (От такого подхода мы ушли в пользу livewire)

6
  • При правильном написании приложени и разумном кешировании статики первая отрисовка вью может произойти менее чем через 100мс. 11 янв 2021 в 10:56
  • @VasiliyRusin когда приложение не большое - да 11 янв 2021 в 13:15
  • А чем отличается большое приложение от небольшого? Вы же грузите не все приложение разом, а только запрашиваемую страницу. 11 янв 2021 в 18:11
  • тем что в больших приложениях собираються больше зависимостей, которые грузятся на всех страницах 11 янв 2021 в 19:40
  • Все зависимости грузятся лишь один раз в chunk-vendors.js, Ваш вопрос о том как правильно делать если важна скорость отрисовки, ответ - использовать JS фраемвок с разумным делнием кода и кешированием. Когда страница вашего приложения уже закеширована на клиенте пользователя она откроется практически мгновенно. Статистика реального проекта: 35К строк кода 300мс до первой отрисовки 12 янв 2021 в 8:34

1 ответ 1

0

Пришёл к выводу что Livewire и Vue не подходят под такие "мелкие" фронтэнд задачи.

Остановился на Alpine.js, это лёгкая библиотека именно для таких целей. Ещё её разрабатывает и поддерживает создатель Livewire.

Ваш ответ

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

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