Programming with flutter is a lot of fun.
In fact, I’ve been developing idea Lane for about two years now.
But to be honest, I currently feel that it’s difficult to recommend Flutter Web for developing proper software.
I’ll explain why.
Why I don’t recommend using Flutter Web on production Environment
There are three main reasons for this.
Basically, it’s due to serious bugs that hasn’t been fixed.
First: TextField focus switching can be a big problem.
When focusing on a TextField at the bottom of the screen in a smartphone browser, the whole screen shifts upwards and cannot be restored.
It’s easy to explain in words, but the symptom is serious.
It may be hard to understand what’s going on, but the problem is that when you focus on a TextField, the entire Flutter drawing area slides up.
This occurs on an actual smartphone (Android + Chrome).
It can be reproduced with a simple code.
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
builder: (context, child) => const MyApp(),
));
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
State<StatefulWidget> createState() {
return _MyAppState();
}
}
class _MyAppState extends State<MyApp> {
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
const Spacer(),
Container(
padding: const EdgeInsets.all(16),
color: Colors.indigo,
child: EditableText(
controller: TextEditingController(),
focusNode: FocusNode(),
style: const TextStyle(fontSize: 14, color: Colors.black),
cursorColor: Colors.white,
backgroundCursorColor: Colors.transparent,
),
),
],
),
);
}
}
Keyboard issue on mobile Web platform #124205
This was reported in 2023, and the issue has many comments (over 100), but it has not been resolved.
When you actually encounter it, you realize that it is a pretty serious problem, but since the priority has not changed, I think it will remain like this for a long time.
Second: The display is distorted when inputting into a TextField.
The second one is also on TextField.
If you just type Japanese on your smartphone, a strange situation will occur.
(Selected screen keybaord is iPhone Standard “Japnanese – Kana”)
It may be hard to understand what’s going on, but when you enter Japanese in a TextField, the display becomes distorted.
This occurs on an actual smartphone(The above is an iPhone + Chrome).
But the display distortion varies depending on the smartphone model, browser, IME combination, and Flutter version. Characters often overlap twice.
It can be easily reproduced with a short source.
Please access from an actual smartphone, not a PC.
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
Widget build(BuildContext context) {
return const MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: TextField(maxLines: null),
),
);
}
}
I have raised an issue, but there is no prospect of it being fixed.
[flutter web] A highlight of characters is incorrect on composing mode at TextField. #151097
This is a problem with smartphones, but there are different issues with PCs.
example: flutter/flutter TextField’s underline on text is misaligned on Web when using Japanese Keyboard (ATOK 2014)
When inputting Japanese into Flutter Web, the display becomes distorted in a very basic widget like TextField (EditableText).
Unfortunately, this does not occur in English-speaking countries, so I cannot expect that the issue will be prioritized.
3. The initial display is very slow.
The software made with Flutter Web is slow to start up.
The main reasons are as follows:
- It takes time to load WebKit, the default rendering engine.
- When the software becomes large, you can split main.dart.js by “defferd as” and load it lazily. However, this has problems and is not practical as is.
–> [web] DeferredLoadException after deploying a new version of app #127459 - In addition, fonts need to be loaded to display Japanese, which takes even more time.

There are many great things about Flutter itself.
And most importantly, writing programs in Flutter is fun.
However, I have to say that at this time it is difficult to create and release large-scale software with Flutter Web.
Of course, a super engineer can easily overcome any problem.
But for an ordinary person like me, it would take too much time to research and try to work around Flutter’s bugs, instead of developing actual features.
I think flutter will be fine for small-scale apps that don’t require Japanese input, though.
Deep-rooted problem
I think the fundamental problem is not that a bug exists, but that serious problems remains for a long time.
Many people face the same problem, and even if the issue has many comments and reactions, it still does not get resolved for a long time. (It may take years.)
Flutter regularly releases new features such as AI support, so development is not stopped.
However, serious problems are not prioritized and are left unsolved for a long time.
This means that there is probably a problem with the definition of the severity of the bug or a problem with the triage process.
As a result, even if it is a big problem from the user’s perspective, it is not prioritized from the development perspective, so it never gets fixed. I think this is a deep-rooted problem.
I take the time to answer each of flutter’s surveys, but I don’t feel like the situation is improving.
Summary
- Programming with Flutter is fun.
- Multi-platform support is great.
- But from my experience, it’s pretty tough to use Flutter Web in a production environment.
You will only notice the serious problems with Flutter Web once you actually deploy the software to a web server and access it with a smartphone or other device.
What’s more, even if you report the problems, they will not be fixed for a long time, which can be very frustrating.
So, everyone, although Flutter Web has its good points, I recommend that you understand the above before fully adopting it.
コメント / Comment