Flutter web nedir?
- Flutter kursu
- Uzman seviye
- Ders 26/39
- 4 dk
Flutter web'in canvas ve HTML renderer'larını öğrenirsin.
Flutter web nedir?
flutter_web, Flutter uygulamasını tarayıcıda çalıştırır. İki renderer seçeneği vardır: canvas (CanvasKit, yüksek performans) ve html (DOM, küçük boyut). wasm renderer da yeni nesil seçenektir.
// Çalıştırma
flutter run -d chrome --web-renderer canvascanvas vs html
canvas renderer (CanvasKit) WebGL kullanır, yüksek performanslı ve görsel olarak mobildekiyle aynıdır. html renderer DOM elemanları kullanır, daha küçük başlangıç boyutu ama bazı görsel farklar vardır.
Uygulama Renderer listesi
main'de ['canvas', 'html', 'wasm'] listesi tanımla. Listenin ilk elemanını print ile yazdır.
Başlangıç kodu
void main() {
// canvas, html, wasm elemanlarından oluşan renderers listesi tanımla
// ilk elemanını yazdır
}Örnek çözüm
void main() {
final renderers = ['canvas', 'html', 'wasm'];
print(renderers.first);
}Beklenen çıktı
canvas
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Flutter web hangi iki renderer ile çalışabilir?
- Skia ve OpenGL
- canvas ve html Doğru cevap
- iOS ve Android
- Vulkan ve Metal
Açıklama: Flutter web canvas (CanvasKit) ve html renderer ile çalışır; iOS/Android mobil, Vulkan/Metal grafik API, Skia/OpenGL ise iç grafik motorudur.
2 canvas renderer seç
flutter run -d chrome --web-renderer ____flutter run -d chrome --web-renderer canvasAçıklama: canvas renderer CanvasKit ile WebGL kullanır; html DOM kullanır, wasm yeni nesil renderer'dır, dom ise renderer adı değil HTML'in temel elemanıdır.
3 Flutter web renderer eşleşmeleri
| Kavram | Anlamı |
|---|---|
flutter_web |
Web platformu |
canvas |
CanvasKit renderer |
html |
DOM renderer |
wasm |
Yeni nesil renderer |