Flutter const with const constructors

Question

Up until today I haven't seen this dart code suggestions. I am happy to follow best practise, but to be honest, this makes no sense showing up in a stateful widget with no constructor. I thought it might be related to the @immutable annotation, but it doesn't seem to be and the dart documentation doesn't really help.

Dart Docs https://dart-lang.github.io/linter/lints/prefer_const_constructors.html

Code Suggestions in VSCode

Prefer const literals as parameters of constructors on @immutable classes.dart. || Prefer const with constant constructors

Question: Is this something I need to care about or has my plugin on VSCode gone haywire?

Code sample where this shows for all widgets.

 Column(
 children: [
 Container(
 margin: EdgeInsets.only(left: 20, right: 20),
 height: 50,
 decoration: BoxDecoration(
 borderRadius: BorderRadius.all(
 Radius.circular(30),
 ),
 color: Colors.black,
 ),
 child: Center(
 child: Text(
 'Create Account',
 style: TextStyle(
 color: Colors.white,
 fontWeight: FontWeight.w600,
 fontSize: 19),
 ),
 ),
 ),
 SizedBox(
 height: 20,
 )

Screen for completeness

enter image description here

• jamesdlin: The lint is telling that those particular instances of the TextStyle, SizedBox, Center, etc. widgets are all being constructed with compile-time constants, and therefore you should mark them all as const to avoid needing to re-construct them at runtime whenever your widget tree is rebuilt. It's completely applicable to your code.

Answer 1

Lint interpreter always will show you the best possible way to improvise your coding and performance optimization tips.

For ex: in your code, there are many widgets that are not going to rebuild. cause it's compile-time constants as they are not dependent on other dynamic properties.

Column(
 children: [
 Container(
 margin: const EdgeInsets.only(left: 20, right: 20),
 height: 50,
 decoration: BoxDecoration(
 borderRadius: BorderRadius.all(
 Radius.circular(30),
 ),
 color: Colors.black,
 ),
 child: const Center( // compile time constant widget
 child: const Text( // compile time constant widget
 'Create Account',
 style: TextStyle(
 color: Colors.white,
 fontWeight: FontWeight.w600,
 fontSize: 19),
 ),
 ),
 ),
 const SizedBox( // compile time constant widget
 height: 20,
 )

Let say, your Text widget value depends on some other variable x, instead of the static value "Create Account" Then you cannot add const keyword before your Text Widget as it's not compile-time constant value.

Even if you don't worry about this kind of lint suggestions, it's fine. But, for your long journey in the development will be very smoother if you take consideration of lint suggestions

• Yonkee: Thanks for the response. Although this will boost performance without unnecessary widget rebuild, if the component is mutable, then how do I mark it to avoid all my code showing this distracting lines?
• nvoigt: It will stop being marked as such, once you component actually changes those. If you replace your compile time constants with variables, the linter will stop. But if your component does not actually mutate those values, it can be const and should be const. Please note that the linter is not talking about making your component immutable. Just the parts of the component that do not actually change.
• Yonkee: Thanks, that makes sense, although I feel like Dart should be smart enough to determine if a variable is associated with a widget or not, i fact I thought this was how it worked. Making the const explicit seems like a tedious process when this can be inferred. Either way, thanks for you answer.

Answer 2

To avoid the prefer const with constant constructors warning add this rule prefer_const_constructors : false to the analysis_options.yaml file.

linter:
rules:
prefer_const_constructors : false
# avoid_print: false # Uncomment to disable the `avoid_print` rule
# prefer_single_quotes: true # Uncomment to enable the