[BUG] Significant increase in bundle size when using flutter_html

[szepeshazi]

Describe the bug:

When comparing a minimal MaterialApp containing a single Text child node, and a MaterialApp containing a single Html node, the total size of the web application increases significantly.

To test, build the below minimal applications with flutter build web --release command (used Win11 x64 for building).

First app, without flutter_html

import 'package:flutter/material.dart';

void main() {
  runApp(const MinimalApp());
}

class MinimalApp extends StatelessWidget {
  const MinimalApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Text('Smallest possible Flutter web app'),
        ),
      ),
    );
  }
}

main.dart.js size: 1.26Mb

Network traffic when loading the app:

• 11 requests
• 5.9 MB transferred
• 10.2 MB resources

Second app, with flutter_html

import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';

void main() {
  runApp(const MinimalApp());
}

class MinimalApp extends StatelessWidget {
  const MinimalApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Center(
        child: Html(data: 'Smallest possible Flutter html app'),
      ),
    );
  }
}

main.dart.js size: 2.77Mb (size increase: 1.51Mb)

Network traffic when loading the app:

• 33 requests
• 8.4 MB transferred
• 12.7 MB resources

Expected behavior:

main.dart.js size should not increase to more than double, when using a html widget containing a single node. Also, the application should not load eagerly many fonts that will not be used during rendering (see screenshot).

Screenshots:

Device details and Flutter/Dart/flutter_html versions:

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.0.5, on Microsoft Windows [Version 10.0.22000.795], locale en-US)
[√] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[√] Chrome - develop for the web
[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2021.2)
[√] IntelliJ IDEA Ultimate Edition (version 2022.1)
[√] Connected device (3 available)
[√] HTTP Host Availability

flutter_html:

  flutter_html:
    dependency: "direct main"
    description:
      name: flutter_html
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.2.1"

A picture of a cute animal (not mandatory but encouraged)

[erickok]

Please try flutter_html 3, which is in alpha. This has been modularised for exactly this purpose (among others). You can (in fact have to) opt in for features such as math support (where all the fonts are coming from).

[szepeshazi]

Please try flutter_html 3, which is in alpha. This has been modularised for exactly this purpose (among others). You can (in fact have to) opt in for features such as math support (where all the fonts are coming from).

Excellent news! Will do so. Thanks for this.