BestHub
search
Sign in
Tag

CanvasKit

1 views collected around this technical thread.

Sohu Tech Products
Sohu Tech Products
Jul 17, 2024 · Frontend Development

Optimizing Flutter Web Startup: main.dart.js Splitting, CanvasKit Loading, and Font Loading Optimization

By splitting the main.dart.js bundle with deferred components, serving CanvasKit assets and Google fonts from a private CDN, and optionally using the HTML renderer during development, Flutter Web apps can cut their startup time by five to six seconds, achieving sub‑second load performance.

CanvasKitDeferred ComponentsFlutter Web
0 likes · 19 min read
Optimizing Flutter Web Startup: main.dart.js Splitting, CanvasKit Loading, and Font Loading Optimization
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 20, 2023 · Frontend Development

Building a High‑Performance Genshin Impact Map with CanvasKit, Gesture Recognition, and React/Vue Integration

This article explains why the official web map built with Leaflet suffers from poor performance, how using CanvasKit (Skia compiled to WebAssembly) together with @use-gesture and popmotion dramatically improves rendering speed and interaction smoothness, and provides a complete implementation and component wrappers for Vue and React.

CanvasKitMap RenderingReAct
0 likes · 14 min read
Building a High‑Performance Genshin Impact Map with CanvasKit, Gesture Recognition, and React/Vue Integration
HomeTech
HomeTech
Sep 6, 2023 · Frontend Development

Performance Optimization and Element‑Embedding for Flutter Web (FFW)

This article analyzes the performance drawbacks of Flutter For Web's two rendering modes, presents practical optimization techniques for both HTML and CanvasKit renderers, introduces the new element‑embedding feature, and proposes a seamless AB‑switching solution to combine fast initial load with smooth interactive performance.

CanvasKitFlutterPerformance
0 likes · 12 min read
Performance Optimization and Element‑Embedding for Flutter Web (FFW)