Getting to know js_interop
summary
Explains concrete JS <-> Dart conversions: use the web package and jsify and dartify for coarse map/object work but prefer targeted conversions because arrays and promises need two-step conversions (collection first, contents second) and promises convert to futures but still contain JS types. Shows using JS interop unsafe for property access, setProperty and bracket notation, external/@JS for Chrome APIs, and exporting Dart classes to JS. Demo adds gamepad to a T‑Rex game and a Chrome extension — both work.
AI-written summary · about
chapters (22)
- 0:00Welcome
- 1:03JS interop overview
- 2:29Dart and JS types
- 4:55Technical difficulties
- 5:36JS interop types
- 6:41JS to Dart conversions
- 9:11Type checking JS values
- 9:31Parameterized types
- 11:38JS objects and maps
- 13:04Unsafe JS interop
- 14:09Dart from JS objects
- 15:56Safe type casting
- 17:43JS objects lessons
- 18:04JS functions
- 19:08Calling JS from Dart
- 20:12External libraries
- 21:14Exporting Dart classes
- 22:16Practical exports
- 23:22Null vs undefined
- 24:49Void and edge cases
- 25:11JS interop tips
- 26:15Final thoughts
related talks
37mElevating JavaScript interoperability with Dart
41mBrowser Internals for JS Devs
31mThe Winding Road Towards JS Interoperability
36mJaspr - Dart, but for Websites
56mJoin The Dart Side Of Web Development 2
45mInteraction with real-world JavaScript from compiled Rust
17mThe jsdom
43mJaspr: Unleashing the Power of Dart for Modern Web Development