October 21, 2022

Производительность приложений на Bubble. Заметки. Часть 5. Одностраничное или многостраничное.

Данная серия статей — это мои заметки по книге The Ultimate Guide to Bubble Performance. Тут изложено только то, что фиксировал я, т.к. посчитал это важным.

Многостраничное VS одностраничное

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

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

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

Чтобы сделать страницу быстрее, можно перенести функционал, который редко используются или вообще не используются на текущей странице, на другие.

Это может быть такой функционал, как:

  • настройки профиля
  • документация
  • сброс пароля и т.д.
К примеру, у Google части его экосистемы раскиданы по разным страницам. Это позволяет работать каждой из них быстро. Представьте, что если бы все они были на одной странице?

Repeating Group

Используйте пагинацию в RG.

Это необходимо, чтобы со временем RG не нагружала страницу.

Пагинация

При разработке мы работаем с небольшим количеством данных в RG, но со временем объём данных в базе увеличивается. Это может привести к тому, что на странице в RG вместо 10 записей, которые мы видели при разработке, будет выводится 1000 записей, что сильно нагрузит страницу. Тем более, если у вас одностраничное приложение.

При пагинации мы ограничиваем количество выводимых записей одновременно.

Прячьте элементы по умолчанию.

Скрывайте элементы, которые не нужны сразу.

К примеру, с той же RG. Если вам не нужно отображать записи в ней сразу после загрузки страницы — скройте их по умолчанию. Пусть юзер нажмёт на кнопку, чтобы отобразить их.

Отложенная загрузка

Это когда отображаем только тот контент, который входит в пределы экрана пользователя. Прокрутил вниз — отобразили ещё контент.

Пример отложенной загрузки мы можем видеть в IG — контент прогружается постепенно с прокруткой экрана.


Если статья принесла для вас полезную информацию, поставьте огонёк 🔥 ниже.

→ Подписывайтесь на мой канал в Телеграме Иван Некодит.

В канале рассказываю про:

  • Путь разработчика
  • Разработку на Nocode-инструментах.