Поделиться через


Рекомендации по мобильным приложениям Teams

Мобильные устройства имеют ограниченную вычислительную мощность, сетевое подключение и батарею по сравнению с настольными компьютерами и ноутбуками. Если вы хотите расширить внедрение приложения вкладки Teams на мобильных устройствах, необходимо обеспечить быстрый и быстрый веб-интерфейс в клиентах Teams Для Android и iOS. В этой статье описаны рекомендации по оптимизации веб-страниц вкладки Teams для мобильного клиента Teams.

Использование рабочих ролей служб для кэширования статических ресурсов

  • Кэшируйте статические ресурсы, такие как HTML, CSS, JavaScript и образы, чтобы уменьшить сетевую зависимость.
  • Используйте стратегию устаревшей проверки во время повторной проверки, чтобы быстро обслуживать кэшированное содержимое при получении обновленных данных в фоновом режиме. Вы также можете использовать эту стратегию для кэширования ответов API, которые не изменяются часто, например данных конфигурации.
  • Избегайте кэширования больших ресурсов, чтобы предотвратить ненужное использование хранилища на мобильных устройствах.

Пример приложения

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

Минимизация размера веб-страницы

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

Аудит производительности

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

  1. Включите средства разработки.

  2. Откройте средства разработки и выберите проверить под приложением. Откроется новое окно.

  3. Перейдите на вкладку Производительность . Вы увидите маркер производительности, указывающий время, которое требуется приложению, после инициализации пакета SDK для JavaScript для Teams до notifySuccess вызова. Этот маркер можно использовать для проверки сетевых или локальных операций, выполняемых между init() и notifySuccess.

    В следующем примере в разделе "Время " показано, что приложение занимает 2,20 секунды от инициализации пакета SDK для Teams JavaScript до notifySuccess, выполняет два вызова для получения маркера авторизации и выполняет третий вызов API, который занимает 1,5 секунды.

    Снимок экрана: вкладка

  4. Перейдите на вкладку Lighthouse . На этой вкладке представлены аналитические сведения о размере приложения и метриках производительности.

    1. В разделе Устройство выберите Мобильные устройства.

    2. Выберите Анализ загрузки страницы.

      Снимок экрана: вкладка Lighthouse в разделе средства разработки.

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

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

    1. Если вы не можете найти его на домашней странице средств разработки, перейдите в раздел Дополнительные средства>охвата.

      Снимок экрана: включение средств покрытия в средствах разработки.

    2. Отчет можно использовать для удаления неиспользуемого кода или ресурсов.

      Снимок экрана: отчет, созданный средством покрытия.

См. также