Flutter

āļāļēāļĢāđ€āļžāļīāđˆāļĄāļ›āļĢāļ°āļŠāļīāļ—āļ˜āļīāļ āļēāļžāļāļēāļĢāļ—āļģāļ‡āļēāļ™

āļāļēāļĢāļ—āļģ profiling āļ”āđ‰āļ§āļĒ DevTools, Isolates, compute, āļāļēāļĢāļĨāļ” jank, āļāļēāļĢāđ€āļĢāļ™āđ€āļ”āļ­āļĢāđŒāđ€āļŸāļĢāļĄ, raster thread, āļāļēāļĢāđ€āļžāļīāđˆāļĄāļ›āļĢāļ°āļŠāļīāļ—āļ˜āļīāļ āļēāļžāļ‚āļ™āļēāļ”āđāļ­āļ›

26 āļ„āļģāļ–āļēāļĄāļŠāļąāļĄāļ āļēāļĐāļ“āđŒÂ·
Senior
1

āđ€āļ„āļĢāļ·āđˆāļ­āļ‡āļĄāļ·āļ­āđƒāļ”āļ‚āļ­āļ‡ Flutter DevTools āļ—āļĩāđˆāļŠāđˆāļ§āļĒāļ§āļīāđ€āļ„āļĢāļēāļ°āļŦāđŒāļ›āļąāļāļŦāļēāļ”āđ‰āļēāļ™āļ›āļĢāļ°āļŠāļīāļ—āļ˜āļīāļ āļēāļžāļ—āļĩāđˆāđ€āļāļĩāđˆāļĒāļ§āļ‚āđ‰āļ­āļ‡āļāļąāļšāļāļēāļĢāđ€āļĢāļ™āđ€āļ”āļ­āļĢāđŒāđ€āļŸāļĢāļĄ?

āļ„āļģāļ•āļ­āļš

Performance view (āļŦāļĢāļ·āļ­ Timeline view) āđƒāļ™ Flutter DevTools āļŠāđˆāļ§āļĒāđƒāļŦāđ‰āļĄāļ­āļ‡āđ€āļŦāđ‡āļ™āđ€āļŸāļĢāļĄāļ—āļĩāđˆāđāļ­āļ›āļžāļĨāļīāđ€āļ„āļŠāļąāļ™āđ€āļĢāļ™āđ€āļ”āļ­āļĢāđŒāđāļĨāļ°āļĢāļ°āļšāļļāđ€āļŸāļĢāļĄāļ—āļĩāđˆāđ€āļāļīāļ™āļ‡āļšāļ›āļĢāļ°āļĄāļēāļ“ 16ms (60 FPS) āđ€āļ„āļĢāļ·āđˆāļ­āļ‡āļĄāļ·āļ­āļ™āļĩāđ‰āđāļŠāļ”āļ‡āļāļīāļˆāļāļĢāļĢāļĄāļ‚āļ­āļ‡ UI thread āđāļĨāļ° raster thread āļŠāđˆāļ§āļĒāļ„āđ‰āļ™āļŦāļēāļˆāļļāļ”āļ„āļ­āļ‚āļ§āļ”āļ—āļĩāđˆāļ—āļģāđƒāļŦāđ‰āđ€āļāļīāļ” jank

2

jank āļ„āļ·āļ­āļ­āļ°āđ„āļĢāđƒāļ™āļšāļĢāļīāļšāļ—āļ‚āļ­āļ‡āđāļ­āļ›āļžāļĨāļīāđ€āļ„āļŠāļąāļ™ Flutter?

āļ„āļģāļ•āļ­āļš

jank āļŦāļĄāļēāļĒāļ–āļķāļ‡āļ­āļēāļāļēāļĢāļāļĢāļ°āļ•āļļāļāļŦāļĢāļ·āļ­āļŠāļ°āļ”āļļāļ”āļ—āļēāļ‡āļŠāļēāļĒāļ•āļēāļ—āļĩāđˆāđ€āļāļīāļ”āļ‚āļķāđ‰āļ™āđ€āļĄāļ·āđˆāļ­āđ€āļŸāļĢāļĄāđƒāļŠāđ‰āđ€āļ§āļĨāļēāđ€āļĢāļ™āđ€āļ”āļ­āļĢāđŒāļĄāļēāļāļāļ§āđˆāļē 16ms (āđ€āļžāļ·āđˆāļ­āđƒāļŦāđ‰āđ„āļ”āđ‰ 60 FPS) āļ‹āļķāđˆāļ‡āļ—āļģāđƒāļŦāđ‰āļœāļđāđ‰āđƒāļŠāđ‰āļĢāļđāđ‰āļŠāļķāļāđ„āļĄāđˆāļĨāļ·āđˆāļ™āđ„āļŦāļĨ jank āļ­āļēāļˆāđ€āļāļīāļ”āļˆāļēāļāļāļēāļĢāļ”āļģāđ€āļ™āļīāļ™āļāļēāļĢāļ—āļĩāđˆāļĄāļĩāļ•āđ‰āļ™āļ—āļļāļ™āļŠāļđāļ‡āļšāļ™ main isolate āļāļēāļĢ rebuild āļ§āļīāļ”āđ€āļˆāđ‡āļ•āļĄāļēāļāđ€āļāļīāļ™āđ„āļ› āļŦāļĢāļ·āļ­āļāļēāļĢāļ”āļģāđ€āļ™āļīāļ™āļāļēāļĢāđ€āļĢāļ™āđ€āļ”āļ­āļĢāđŒāļ—āļĩāđˆāļ‹āļąāļšāļ‹āđ‰āļ­āļ™

3

āļšāļ—āļšāļēāļ—āļ‚āļ­āļ‡ UI thread āđāļĨāļ° raster thread āđƒāļ™ rendering pipeline āļ‚āļ­āļ‡ Flutter āļ„āļ·āļ­āļ­āļ°āđ„āļĢ?

āļ„āļģāļ•āļ­āļš

UI thread āļĢāļąāļ™āđ‚āļ„āđ‰āļ” Dart āļŠāļĢāđ‰āļēāļ‡ widget tree āđāļĨāļ°āļŠāļĢāđ‰āļēāļ‡ layer tree āļŠāđˆāļ§āļ™ raster thread (āđ€āļ”āļīāļĄāļ„āļ·āļ­ GPU thread) āļĢāļąāļš layer tree āļ™āļĩāđ‰āđāļĨāļ°āđāļĢāļŠāđ€āļ•āļ­āļĢāđŒāđ„āļĢāļ‹āđŒāđ€āļ›āđ‡āļ™āļžāļīāļāđ€āļ‹āļĨāļ—āļĩāđˆāđāļŠāļ”āļ‡āļœāļĨāđ„āļ”āđ‰ āļ—āļąāđ‰āļ‡āļŠāļ­āļ‡āļ•āđ‰āļ­āļ‡āļ—āļģāļ‡āļēāļ™āđƒāļŦāđ‰āđ€āļŠāļĢāđ‡āļˆāļ āļēāļĒāđƒāļ™āđ„āļĄāđˆāļ–āļķāļ‡ 16ms āđ€āļžāļ·āđˆāļ­āļĢāļąāļāļĐāļē 60 FPS āļ›āļąāļāļŦāļēāļ—āļĩāđˆāđ€āļāļīāļ”āļāļąāļšāļ­āļĒāđˆāļēāļ‡āđƒāļ”āļ­āļĒāđˆāļēāļ‡āļŦāļ™āļķāđˆāļ‡āļ­āļēāļˆāļ—āļģāđƒāļŦāđ‰āđ€āļāļīāļ” jank

4

āđ€āļŦāļ•āļļāđƒāļ”āļāļēāļĢāđƒāļŠāđ‰ const constructor āļŠāļģāļŦāļĢāļąāļšāļ§āļīāļ”āđ€āļˆāđ‡āļ•āļˆāļķāļ‡āļŠāđˆāļ§āļĒāđ€āļžāļīāđˆāļĄāļ›āļĢāļ°āļŠāļīāļ—āļ˜āļīāļ āļēāļž?

5

Isolate āđƒāļ™ Dart āļ„āļ·āļ­āļ­āļ°āđ„āļĢāđāļĨāļ°āđ€āļŦāļ•āļļāđƒāļ”āļˆāļķāļ‡āļŠāļģāļ„āļąāļāļ•āđˆāļ­āļ›āļĢāļ°āļŠāļīāļ—āļ˜āļīāļ āļēāļž?

+23 āļ„āļģāļ–āļēāļĄāļŠāļąāļĄāļ āļēāļĐāļ“āđŒ

āļŦāļąāļ§āļ‚āđ‰āļ­āļŠāļąāļĄāļ āļēāļĐāļ“āđŒ Flutter āļ­āļ·āđˆāļ™āđ†

āļžāļ·āđ‰āļ™āļāļēāļ™ Dart

Junior
25 āļ„āļģāļ–āļēāļĄ

āļžāļ·āđ‰āļ™āļāļēāļ™āļ āļēāļĐāļē Dart

Junior
15 āļ„āļģāļ–āļēāļĄ

āļžāļ·āđ‰āļ™āļāļēāļ™ Flutter

Junior
18 āļ„āļģāļ–āļēāļĄ

āļ§āļ‡āļˆāļĢāļŠāļĩāļ§āļīāļ•āļ‚āļ­āļ‡ Widget

Junior
20 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļˆāļąāļ”āđ€āļāđ‡āļšāļ‚āđ‰āļ­āļĄāļđāļĨāđƒāļ™āđ€āļ„āļĢāļ·āđˆāļ­āļ‡

Junior
20 āļ„āļģāļ–āļēāļĄ

āļ§āļ‡āļˆāļĢāļŠāļĩāļ§āļīāļ•āļ‚āļ­āļ‡āđāļ­āļ›āļžāļĨāļīāđ€āļ„āļŠāļąāļ™

Junior
20 āļ„āļģāļ–āļēāļĄ

Layouts & Constraints

Mid-Level
24 āļ„āļģāļ–āļēāļĄ

ListView & GridView

Mid-Level
25 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļ™āļģāļ—āļēāļ‡āđāļĨāļ° Routing

Mid-Level
22 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļˆāļąāļ”āļāļēāļĢ State āļžāļ·āđ‰āļ™āļāļēāļ™

Mid-Level
22 āļ„āļģāļ–āļēāļĄ

Provider Pattern

Mid-Level
18 āļ„āļģāļ–āļēāļĄ

Networking & HTTP

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļ‹āļĩāđ€āļĢāļĩāļĒāļĨāđ„āļĨāļ‹āđŒ JSON

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

āļāļēāļ™āļ‚āđ‰āļ­āļĄāļđāļĨāđƒāļ™āđ€āļ„āļĢāļ·āđˆāļ­āļ‡

Mid-Level
22 āļ„āļģāļ–āļēāļĄ

āļŸāļ­āļĢāđŒāļĄāđāļĨāļ°āļāļēāļĢāļ•āļĢāļ§āļˆāļŠāļ­āļšāļ„āļ§āļēāļĄāļ–āļđāļāļ•āđ‰āļ­āļ‡

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

āđāļ­āļ™āļīāđ€āļĄāļŠāļąāļ™

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļœāļŠāļēāļ™āļĢāļ§āļĄ Firebase

Mid-Level
18 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļ—āļ”āļŠāļ­āļšāļĒāļđāļ™āļīāļ•

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļ—āļ”āļŠāļ­āļš widget

Mid-Level
18 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢ Build āđāļĨāļ° Deploy

Mid-Level
16 āļ„āļģāļ–āļēāļĄ

āļāļēāļĢāļˆāļąāļ”āļāļēāļĢāđāļžāđ‡āļāđ€āļāļˆ

Mid-Level
16 āļ„āļģāļ–āļēāļĄ

āļŦāļ™āđˆāļ§āļĒāļ„āļ§āļēāļĄāļˆāļģāđāļĨāļ°āļ›āļĢāļ°āļŠāļīāļ—āļ˜āļīāļ āļēāļž

Senior
22 āļ„āļģāļ–āļēāļĄ

Streams & RxDart

Senior
24 āļ„āļģāļ–āļēāļĄ

State Management āļ‚āļąāđ‰āļ™āļŠāļđāļ‡

Senior
26 āļ„āļģāļ–āļēāļĄ

Flutter Design Patterns

Senior
24 āļ„āļģāļ–āļēāļĄ

Platform Channels

Senior
20 āļ„āļģāļ–āļēāļĄ

Custom Painting

Senior
22 āļ„āļģāļ–āļēāļĄ

āļŠāļ–āļēāļ›āļąāļ•āļĒāļāļĢāļĢāļĄāđāļ­āļ›āļžāļĨāļīāđ€āļ„āļŠāļąāļ™ Flutter

Senior
22 āļ„āļģāļ–āļēāļĄ

āđ€āļŠāļĩāđˆāļĒāļ§āļŠāļēāļ Flutter āļŠāļģāļŦāļĢāļąāļšāļāļēāļĢāļŠāļąāļĄāļ āļēāļĐāļ“āđŒāļ„āļĢāļąāđ‰āļ‡āļ–āļąāļ”āđ„āļ›

āđ€āļ‚āđ‰āļēāļ–āļķāļ‡āļ„āļģāļ–āļēāļĄāļ—āļąāđ‰āļ‡āļŦāļĄāļ” flashcards āđāļšāļšāļ—āļ”āļŠāļ­āļšāđ€āļ—āļ„āļ™āļīāļ„ āđāļšāļšāļāļķāļāļŦāļąāļ” code review āđāļĨāļ°āļ•āļąāļ§āļˆāļģāļĨāļ­āļ‡āļŠāļąāļĄāļ āļēāļĐāļ“āđŒ

āđ€āļĢāļīāđˆāļĄāđƒāļŠāđ‰āļŸāļĢāļĩ