Flutter Engage — Flutter 2
Tags: flutter, programming, productivity, computerscience
Published: 2021-03-04 15:24:59

<!-- wp:paragraph -->
<p>This event happened on 3rd March 2021. This article is divided into</p>
<!-- /wp:paragraph -->

<!-- wp:list {"ordered":true} -->
<ol><li>Keynote</li><li>AskFlutter Leadership Roundtable</li></ol>
<!-- /wp:list -->

<!-- wp:heading {"level":3} -->
<h3>Keynote</h3>
<!-- /wp:heading -->

<!-- wp:list -->
<ul><li>Introduction of <a href="https://www.trainwithpush.com/" rel="noreferrer noopener" target="_blank">Push Company</a></li><li>Announcement of Flutter 2</li></ul>
<!-- /wp:list -->

<!-- wp:heading {"level":4} -->
<h4>What’s New in Flutter&nbsp;2</h4>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>We’ve broadened Flutter from a mobile framework to a <strong>portable</strong> framework, unleashing your apps to run on a wide variety of different platforms with little or no change.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Every app gets a free upgrade with Flutter 2 and they can now grow to target desktop and web.</p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*1hUPX6K3Vzmm8wUow6Lf8Q.png" alt="Flutter Engage — Flutter 2"/><figcaption>Flutter Engage — Flutter&nbsp;2</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li><a href="https://flutter.gskinner.com/" rel="noreferrer noopener" target="_blank"><strong>gSkinner</strong></a> introduces <a href="https://github.com/gskinnerTeam/flutter-folio" rel="noreferrer noopener" target="_blank"><strong>Flutter Folio (a scrapbooking app)</strong></a></li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*E_N8VJnr_V_e2eXFSVjVlw.png" alt="Flutter Engage — Flutter 2"/><figcaption>Flutter Engage — Flutter&nbsp;2</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li>Flutter 2: Improved performance, stability, supports the latest UI trend, increased accessibility support, state restoration APIs, and much more.</li><li>Around 6k+ issues closed, check out the post</li></ul>
<!-- /wp:list -->

<!-- wp:list -->
<ul><li>Flutter used in Google by</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*MjEXUF5FegjeLFex.png" alt="Google Products using Flutter"/><figcaption>Google Products using&nbsp;Flutter</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li>VP Engineering of Google Pay shares his thoughts on Flutter</li></ul>
<!-- /wp:list -->

<!-- wp:list {"ordered":true} -->
<ol><li>Tech debts brought down by 90% per engineer basis</li><li>Engineers were 20% more productive</li><li>He recommend teams use Flutter for multiple platforms.</li></ol>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*Yu_UG9fVCifJDhdigLC3fQ.png" alt="GPay Stats"/><figcaption>GPay Stats</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li>Microsoft is contributing code to Flutter in recent months.</li></ul>
<!-- /wp:list -->

<!-- wp:list {"ordered":true} -->
<ol><li>Brings foldable support to Flutter.</li><li>A new widget (<a href="https://docs.microsoft.com/en-us/dual-screen/flutter/twopane-widget" rel="noreferrer noopener" target="_blank">TwoPane</a>)</li></ol>
<!-- /wp:list -->

<!-- wp:code -->
<pre class="wp-block-code"><code>Widget build(BuildContext context) {
  return TwoPane(
    pane1: _widgetA(),
    pane2: _widgetB(),
    paneProportion: 0.3,
    panePriority: MediaQuery.of(context).size.width > 500 ? TwoPanePriority.both :TwoPanePriority.pane1,
  );
}</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p>3. <a href="https://docs.microsoft.com/en-us/dual-screen/flutter/mediaquery" rel="noreferrer noopener" target="_blank">Display features</a> to mediaquery</p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*OXRr-WiW0FfLk1bCJ1Bn9g.png" alt=""/><figcaption>Microsoft and&nbsp;Flutter</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li>Announcement of Flutter Web as stable</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>In this initial release of web support, the focus is on three app scenarios:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li><strong>Progressive web apps (PWAs)</strong> combine the web’s reach with the capabilities of a desktop app.</li><li><strong>Single page apps (SPAs)</strong> that load once and transmit data to and from internet services.</li><li><strong>Expanding existing Flutter mobile apps to the web</strong>, enabling shared code for both experiences.</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*A5e95hNf1eAkOvqO.png" alt="Flutter Web Stable"/><figcaption>Flutter Web&nbsp;Stable</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li>Director of Web developer ecosystem Google shares some thoughts</li></ul>
<!-- /wp:list -->

<!-- wp:list {"ordered":true} -->
<ol><li>Flutter Web as an option now for creating web apps amongst others</li></ol>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*HgIM_Ir1lsemxWhavo5pHw.png" alt="Options for Web development"/><figcaption>Options for Web development</figcaption></figure>
<!-- /wp:image -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:paragraph -->
<p>PWA’s are a great fit for flutter</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>3. Flutter and Chrome team are working together</p>
<!-- /wp:paragraph -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:list -->
<ul><li>Flutter Web features</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*zdfEvGqK4UnXK4PM08rDPQ.png" alt=""/></figure>
<!-- /wp:image -->

<!-- wp:list {"ordered":true} -->
<ol><li><strong>Performance</strong></li></ol>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>We discovered that CanvasKit can deliver superior performance, fidelity, and correctness.</p>
<!-- /wp:paragraph -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p><a href="https://flutterplasma.dev/" rel="noreferrer noopener" target="_blank">Demo</a> (flutter plasma)</p></blockquote>
<!-- /wp:quote -->

<!-- wp:paragraph -->
<p>2. <strong>Web-specific features and widgets</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A Flutter app running in the browser should feel like a web app. So we added features to Flutter that help you use the best of the web.</p>
<!-- /wp:paragraph -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p><a href="https://pub.dev/documentation/url_launcher/latest/link/Link-class.html" rel="noreferrer noopener" target="_blank">Hyperlink</a>, <a href="https://api.flutter.dev/flutter/widgets/AutofillGroup-class.html" rel="noreferrer noopener" target="_blank">text auto-fill</a>, <a href="https://flutter.dev/docs/development/ui/navigation/url-strategies" rel="noreferrer noopener" target="_blank">custom URL strategies</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/Manifest" rel="noreferrer noopener" target="_blank">PWA manifests</a></p></blockquote>
<!-- /wp:quote -->

<!-- wp:paragraph -->
<p>3. <strong>Support for desktop form factors</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>We want to make Flutter web experiences feel right, regardless of the shape and size of your browser window. Desktop browsers offer different UI affordances, and so we’ve updated Flutter accordingly.</p>
<!-- /wp:paragraph -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p><a href="http://flutter.dev/go/update-scrollbars" rel="noreferrer noopener" target="_blank">customizable interactive scrollbars</a>, <a href="http://flutter.dev/go/default-scroll-action" rel="noreferrer noopener" target="_blank">keyboard shortcuts to scroll</a>, <a href="https://api.flutter.dev/flutter/semantics/SemanticsNode-class.html" rel="noreferrer noopener" target="_blank">screen reader support</a></p></blockquote>
<!-- /wp:quote -->

<!-- wp:paragraph -->
<p><a href="https://code.irobot.com/" rel="noreferrer noopener" target="_blank"><em>Demo iRobot</em></a></p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Desktop announced in stable (early release flag)</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*FKda-cjHpoHf9zJDHK3IUA.png" alt="Desktop Stable (under release flag)"/><figcaption>Desktop Stable (under release flag)</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li>Produces standalone executables for each platform</li><li>Microsoft contributed PRs to use the latest Windows Runtime APIS, while running on Windows 10</li><li><a href="https://canonical.com/" rel="noreferrer noopener" target="_blank">Canonical</a> share their experience with Flutter</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*2b5211SqjVWtYP3yq8szrA.png" alt="Canonical and Flutter"/><figcaption>Canonical and Flutter</figcaption></figure>
<!-- /wp:image -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:list {"ordered":true} -->
<ol><li>Flutter SDK available as <a href="https://snapcraft.io/flutter" rel="noreferrer noopener" target="_blank">snap</a> in the snapcraft</li><li>Full multi-window support</li><li>Popular plugins available for Linux</li></ol>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p><a href="https://pub.dev/packages/firebase" rel="noreferrer noopener" target="_blank">firebase</a>, <a href="https://pub.dev/packages/bluetooth" rel="noreferrer noopener" target="_blank">bluetooth</a>, <a href="https://pub.dev/packages/connectivity" rel="noreferrer noopener" target="_blank">connectivity</a>, <a href="https://pub.dev/packages/desktop_notifications" rel="noreferrer noopener" target="_blank">desktop_notifications, </a>etc</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>4. <a href="https://pub.dev/packages/yaru" rel="noreferrer noopener" target="_blank">Yaru</a> (Ubuntu Style) in Flutter</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>5. He recommends Flutter will be the default choice for desktop and mobile apps for <a href="https://canonical.com/" rel="noreferrer noopener" target="_blank">Canonical</a></p>
<!-- /wp:paragraph -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:list -->
<ul><li>Flutter for Embedded devices (<strong>Toyota</strong>)</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*eV_sMzAVFXk3CqXn.png" alt="Toyota and Flutter"/><figcaption>Toyota and Flutter</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list {"ordered":true} -->
<ol><li>Build infotainment systems powered by Flutter.</li><li>Toyota chose Flutter because of its high performance and consistency of experience, fast iteration, and developer ergonomics as well as smartphone-tier touch mechanics.</li><li>By using Flutter’s embedder API, Toyota is able to tailor Flutter for the unique needs of an in-vehicle system.</li></ol>
<!-- /wp:list -->

<!-- wp:list -->
<ul><li>Dart 2.12</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*6DI-t9d_MelfKKuGelQhtQ.png" alt="Dart 2.12"/><figcaption>Dart 2.12</figcaption></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>What really sets languages apart is their unique combination of capabilities.</p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*NbIRWeaaoGzkOy0U" alt="Dart Features"/><figcaption>Dart Features</figcaption></figure>
<!-- /wp:image -->

<!-- wp:list -->
<ul><li><a href="https://dart.dev/guides/libraries/c-interop" rel="noreferrer noopener" target="_blank">Dart FFI</a> is now stable</li></ul>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*iOO0g6atY4kKGNyq-XdDYw.png" alt="Dart FFI now stable"/><figcaption>Dart FFI now&nbsp;stable</figcaption></figure>
<!-- /wp:image -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:list -->
<ul><li>Status quo about data classes in dart</li></ul>
<!-- /wp:list -->

<!-- wp:list {"ordered":true} -->
<ol><li>Also known as Metaprogramming, there are packages that do this like <a href="https://pub.dev/packages/freezed" rel="noreferrer noopener" target="_blank">freezed</a>, <a href="https://pub.dev/packages/built_value" rel="noreferrer noopener" target="_blank">built_value</a>, etc</li><li>Currently, the dart team is still exploring options</li></ol>
<!-- /wp:list -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:list -->
<ul><li>Flutter DevTools — 4 new highlights</li></ul>
<!-- /wp:list -->

<!-- wp:list {"ordered":true} -->
<ol><li><strong>Flutter fix</strong>: The ability for IDE’s to notice when there’s a common exception and offer to bring it up in DevTools to help you debug</li></ol>
<!-- /wp:list -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*aiqSGCUpfTVRK4Fa" alt="DevTools — 1"/><figcaption>DevTools — 1</figcaption></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>2. Null safety via dart migrate</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>3. Inspect the widget if any error occurs.</p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*Xc1vKfF7KZdBsojZ" alt="DevTools — 3"/><figcaption>DevTools — 3</figcaption></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>4. Size debugging tool</p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/1*wQv-wOEEczZXmRkReV_0XQ.png" alt="Size debug tool"/><figcaption>Size debug&nbsp;tool</figcaption></figure>
<!-- /wp:image -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:list -->
<ul><li>Firebase now has 6 packages with sound null safety</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p><a href="https://pub.dev/packages/firebase_auth" rel="noreferrer noopener" target="_blank">firebase_auth</a>, <a href="https://pub.dev/packages/cloud_firestore" rel="noreferrer noopener" target="_blank">cloud_firestore</a>, <a href="https://pub.dev/packages/cloud_functions" rel="noreferrer noopener" target="_blank">cloud_functions</a>, <a href="https://pub.dev/packages/firebase_messaging" rel="noreferrer noopener" target="_blank">firebase_messaging</a>, <a href="https://pub.dev/packages/firebase_storage" rel="noreferrer noopener" target="_blank">cloud_storage</a> and <a href="https://pub.dev/packages/firebase_crashlytics" rel="noreferrer noopener" target="_blank">firebase_crashlytics</a></p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Google Mobile Ads for Beta</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>Open beta for<a href="https://pub.dev/packages/google_mobile_ads" rel="noreferrer noopener" target="_blank"> Google Mobile Ads SDK for Flutter</a>. This is a brand new plugin that provides inline banners and native ads. This plugin unifies support for Ad Manager and Admob now</p>
<!-- /wp:paragraph -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://cdn-images-1.medium.com/max/1600/0*OgjnTYeKOtUGR79P" alt=""/></figure>
<!-- /wp:image -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p><a href="https://play.google.com/store/apps/details?id=co.uk.fictioneers.big_flutter_up&amp;hl=en_SG&amp;gl=US" rel="noreferrer noopener" target="_blank">Demo (Wallace &amp; Gromit)</a></p></blockquote>
<!-- /wp:quote -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:heading {"level":3} -->
<h3>AskFlutter Leadership Roundtable</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>In case you have document-centric pages with a lot of rich text static content, flutter won’t be a good choice.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Will Flutterfire become the official firebase SDK?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Firebase primarily supports iOS, Android and Web. We took the official Firebase SDK and wrapped it in Flutter code. As long as you are using flutterfire in your flutter app, you are using the official Firebase SDK.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Also, the video content of firebase is shifted to flutter now.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Flutter seems understaffed with more than 8k+ issues?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: We are resolving issues as fast as we are getting them. Last year, around 15k+ issues were reported and all of them were resolved. We are pretty happy with the rate of fixing bugs and resolving them.</p>
<!-- /wp:paragraph -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p>More issues = More users</p></blockquote>
<!-- /wp:quote -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p>Issues resolving = People contributing (around 200+ and most of them are non-googlers)</p></blockquote>
<!-- /wp:quote -->

<!-- wp:paragraph -->
<p><strong>Q: When will flutter web drop # in the url? Why does it exist?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Flutter uses a hash URL strategy, something we initialize when we initialize the web engine. So when you have flutter named routes, you are basically initializing them as part of the hash. We have a way to customize the URL and drop the hash. There is a community plugin available <a href="https://pub.dev/packages/url_strategy" rel="noreferrer noopener" target="_blank">here</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Flutter has issues with the new Mac’s M1 architecture. Any solution?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Try again today in Flutter 2.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Any advancements made to platforms like M1, android, etc are addressed immediately. M1 work was categorized into 3 buckets</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Apps run well on M1</li><li>Tools run well on M1</li><li>Can we develop our own tools on the M1</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>M1 was a new platform for us, as we had never done ARM on a host before. Apple Silicon was like a new platform we had to support. We had to make sure everything from <strong>Dart/VM</strong> to <strong>embedder</strong> to <strong>all the layers of fluter, works</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Official guidance to app architecture like Jetpack/Android?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Very soon landing a new template into the master branch. This will be targeting creating an app with best practices (state restoration, app state, etc)</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Will null safety break existing apps?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: No. You would like to start with migrating your dependencies first. Also, you can compile the app with non-nullable and nullable code simultaneously. Compiler in null safety will use null safety optimizations.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Is flutter good for 3D rendering?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Flutter is built on a 2D system, but lots of people have done 3D with it!! APIS we provide is for drawing 2D objects but transforms we use support 3D.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Flutter content itself can embed other OpenGL textures. You can write some OpenGL code, and then embed the OpenGL texture in your flutter app.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>For instance, <a href="https://play.google.com/store/apps/details?id=co.uk.fictioneers.big_flutter_up&amp;hl=en_SG&amp;gl=US" rel="noreferrer noopener" target="_blank"><strong>Wallace &amp; Gromit</strong></a></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: What about Flutter for Desktop?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: It is stable, but we don’t consider it stable. There is no support for multi-window, but for one window it’s pretty solid.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Desktop work was divided into 2 camps:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Teach flutter about what mouse and keyboard are</li><li>Teach flutter engine to run on really big screens (plugged into the wall)</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>To make the web stable, we had to have desktop form factors. Ability to use a trackpad, scroll view, and keyboard</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Why desktop is not labeled stable</strong>? Reasons</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>No good testing on the Flutter side</li><li>No support for accessibility</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p><strong>Q: The best way to learn Riverpod?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Start coding with it</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: SEO for flutter web?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Flutter started as a fork of chrome, indexability has always been on our mind. This release was optimized for web applications and customers using the web.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>SEO is something we are looking into, but right now if you are building a website that needs SEO, flutter is not a good choice</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Problem of janky animations on the first opening of the app?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Performance is the grounding principle of flutter. Every commit in the flutter branch goes through the performance tests. We are aware of the iOS issue, it did get worse when we migrated from OpenGL to Metal (where we are no longer able to cache shaders)</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Ian: We are very much focused. <a href="https://github.com/flutter/flutter/projects/188" rel="noreferrer noopener" target="_blank">Project here</a></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Google plans to use Flutter Web internally?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Teams are experimenting with flutter web. We expect to see more use of Flutter Web. It is being used for internal tools, like migrating flutter code for teams like GPay.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Dart dev tools: built with Flutter Web.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Mediation with AdMob in Flutter?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Mediation is not in the list of <a href="https://pub.dev/packages/google_mobile_ads" rel="noreferrer noopener" target="_blank">google_mobile_ads</a> packages. It is not officially supported, because</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Testing</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>This has to be right, otherwise, someone’s business can be threatened. But this is certainly on the roadmap.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Will Dart support WASM?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: There are two cases</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Compile dart into WASM</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>This is not possible, as it requires features in WASM like Garbage Collection, threading</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Code already compiled in WASM and link to dart: There is a package for this.</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>Flutter Web has 2 renderers:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li><strong>HTML renderer:</strong> Uses a combination of HTML elements, CSS, Canvas elements, and SVG elements. This renderer has a smaller download size.</li><li><strong>CanvasKit renderer:</strong> This renderer uses WASM and WebGL. It renders your app as Skia in the web browser</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>To optimize your Flutter web app for the characteristics of each device, the rendering mode is set by default to auto. This means that your app runs with the HTML renderer on mobile browsers and with CanvasKit on desktop browsers.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Flutter Web vs React vs Angular?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Flutter Web is using canvas, which is different from angular and react. We feel reluctant to compare Flutter to other technologies. We all have valid use cases and we are happy to coexist with these frameworks.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Flutter Web will be suited to what customers require.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: I’m on the beta channel. Should I go to the stable channel?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Beta just became stable. Here’s the update frequency</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Stable (Once a quarter)</li><li>Beta (Once a month)</li><li>Dev (Once a day/week)</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>Flutter Web is now in the stable branch, so yes, you can use stable.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Data classes in dart?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: We are trying to find a good way. There are some packages like <a href="https://pub.dev/packages/freezed" rel="noreferrer noopener" target="_blank">freezed</a>, <a href="https://pub.dev/packages/built_value" rel="noreferrer noopener" target="_blank">built_value</a>, etc</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: The best way to develop a flutter app to work offline/online?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Let’s take firebase. It keeps a local cache of the recent read data. So, we can access the data again, if you restated the app.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>For local write operations, firebase keeps a queue of pending writes. You will still see the data, but in the background, once the app has a network connection, firebase sync the changes to the server.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Difference between the legacy version and the null safety version of the flutterfire?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: Most of the flutterfire plugins are migrated to null safety.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Q: Good IDE for Flutter development?</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>A: All IDE’s work with Flutter.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Andrew uses <a href="https://www.jetbrains.com/idea/" rel="noreferrer noopener" target="_blank">IntelliJ</a>, Eric uses <a href="https://code.visualstudio.com/" rel="noreferrer noopener" target="_blank">VSCode</a>, Ian uses <a href="https://www.gnu.org/software/emacs/" rel="noreferrer noopener" target="_blank">Emacs</a>, Mariam uses <a href="https://www.jetbrains.com/idea/" rel="noreferrer noopener" target="_blank">IntelliJ</a> and Puff uses <a href="https://code.visualstudio.com/" rel="noreferrer noopener" target="_blank">VSCode</a>.</p>
<!-- /wp:paragraph -->