Flutter UI becomes choppy when resizing the window which has iframe - Flutter latest version : Flutter 2.3.0-24.1.pre

Flutter UI becomes choppy when resizing the window which has iframe - Flutter latest version : Flutter 2.3.0-24.1.pre

iframe element is intially placed inside row and when the size of the window is reduced horizontally it is changed to column while changing to colum to row and vice-versa. The Flutter UI becomes choppy as it leaves lot of duplicated UI on the screen.

The below was the sample code which i was using.

Steps to reproduce the issue : Run the below code and resize the browser window horizontaly again and again.

import 'dart:html' as html;
import 'dart:ui' as ui;

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key}) : super(key: key);


  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

  var _iframeWidget = HtmlElementView(
      key: UniqueKey(),
    viewType: 'column',
  );

  @override
  Widget build(BuildContext context) {
    print(' build called');

    var re = ui.platformViewRegistry.registerViewFactory(
      'column',
      (int viewId) {

        html.IFrameElement _iframeElement = html.IFrameElement()
          ..slot = "column"
          ..src = 'https://www.youtube.com/embed/D_mCZlQZg9Y'
          ..style.width = '100%'
          ..style.height = '100%';
        print('plat');

        return _iframeElement;
      },
    );

    return Scaffold(
      appBar: AppBar(
        title: Text('Demo'),
      ),
      body: Center(
        child: Container(
          height: 400,
          width: 500,
          child: MediaQuery.of(context).size.width < 800 ? Row(

            children: [
              Container(width: 300, height: 200, child: _iframeWidget),
               Text('Some text')
            ],
          ) : Column(
            children: [
              Container(width: 300, height: 200, child: _iframeWidget),
              Text('Some text')
            ],
          ),
        ), // This trailing comma makes auto-formatting nicer for build methods.
      ),
    );
  }
}```