Flutter web зависает в ios safari/chrome без ошибок

#flutter #dart #flutter-web

Вопрос:

Я развернул свое веб-приложение flutter для https://buildcode.app, но сайт зависает для ios chrome/safari, а не для Android или настольного компьютера. При проверке с помощью консоли ошибок во время выполнения не появляется, я не знаю, как отлаживать в этой ситуации.

Ответ №1:

Здесь могут возникнуть проблемы с визуализаторами, так как flutter использует два средства визуализации html и canvaskit, и auto(по умолчанию), если мы не выбираем, какое из них использовать, выбирает то, что лучше всего подходит для платформы таргетинга, поскольку эта опция выбирает средство визуализации HTML, когда приложение работает в мобильном браузере, и средство визуализации CanvasKit, когда приложение работает в браузере настольного компьютера.

Средство визуализации HTML: Использует комбинацию элементов HTML, CSS, элементов холста и элементов SVG. Этот визуализатор имеет меньший размер загрузки.

Визуализатор CanvasKit: Этот визуализатор полностью совместим с мобильными и настольными устройствами Flutter, имеет более высокую производительность при более высокой плотности виджетов, но добавляет около 2 МБ в размер загрузки.

Когда мы запустим flutter build web , flutter запустит ваше приложение с автоматическим визуализатором, так как мы не упомянули, какой визуализатор использовать для сборки/запуска. мы можем указать, какой рендерер использовать, используя два флага html и canvaskit : Этот флаг можно использовать с подкомандами выполнить или построить.

Например:

 flutter run -d chrome --web-renderer html
flutter build web --web-renderer canvaskit
 

Поэтому попробуйте создать свое веб-приложение с помощью html-рендерера для ios, так как этот рендерер имеет меньший размер загрузки, как указано в документах flutter здесь.

Попробуйте запустить flutter build web --web-renderer html --release в консоли, и тогда она должна безупречно работать в браузере ios chrome/safari.