Hide (minimize/obfuscate) internal algorithms of a Dart library on flutter web

When building an app using flutter build web, the resulting JS code is already minified by default. This provides a pretty good level of obscurity by renaming symbols (including names of classes, variables, methods etc).

If you want to obfuscate your code even more, you can apply any existing JS obfuscation tool to the compiled code. For example, using javascript-obfuscator:

$ flutter build web
$ cp -r build/web build/web-obfuscated
$ javascript-obfuscator build/web/main.dart.js --output build/web-obfuscated/main.dart.js

However, obfuscation can negatively impact your performance & code size , javascript-obfuscator docs say 15-80%. I tested this approach on a big Flutter project and it resulted in a 3-fold increase in the size of main.dart.js.

A good way around this would be to separate the algorithms needing obfuscation into a separate file using Dart’s deferred loading and executing the obfuscator only on this file.

A simple example of this technique:

algorithm.dart:

int secretAlgorithm() {
  return 42;
}

main.dart:

import 'algorithm.dart' deferred as algorithm;

// ...

class _MyHomePageState extends State<MyHomePage> {
  int? _value;

  @override
  void initState() {
    super.initState();
    Future(() async {
      await algorithm.loadLibrary();
      setState(() => _value = algorithm.secretAlgorithm());
    });
  }
  
  //...
}

Building:

$ flutter build web
$ cp -r build/web build/web-obfuscated
$ javascript-obfuscator build/web/main.dart.js_1.part.js --output build/web-obfuscated/main.dart.js_1.part.js

As you can see, this approach obfuscates only the main.dart.js_1.part.js file which corresponds to the algorithm.dart source file.