내용

• 안드로이드 웹뷰로 플러터 웹앱 띄웠을 때, 초기 로딩이 많이 느린 이슈
• 렌더러 변경 (Html → Canvaskit). 웹 default 렌더러는 Html임

개선 방안

• 안보이는 웹뷰에서 마이데이터 웹 미리 로딩해서 리소스 캐싱
• main.dart.js 쪼개기 (deferred loading)
  • main.dart.js: 플러터(Flutter)로 개발한 웹 애플리케이션을 빌드할 때 생성되는 주요 JavaScript 파일. 플러터 웹 앱이 브라우저에서 실행되려면 Dart 코드를 JavaScript로 변환해야 하는데, 그 결과물이 바로 main.dart.js
• Canvaskit 웹 어셈블리 파일 미리 로딩
• API 미리 로딩
• 한글, 특수문자, 이모지 엑스박스 이슈 → 안보이는 위젯에서 미리 로딩
• 필요없는 리소스 제거 및 용량 큰 리소스 교체

효과

• 속도 50% 이상 개선됨

비고

• iOS 대부분의 기기에서 Canvaskit 렌더러 사용 웹이 하얗게 나오는 이슈가 있어서 AddToApp으로 전환