falcon

Rules / Performance / sized-box-for-whitespace

sized-box-for-whitespace

lint/performance/sized-box-for-whitespace
recommendedflutter
Same as sized_box_for_whitespace · Dart lints

Flags a Container used only to add fixed width/height whitespace.

A Container sized only by width/height (optionally with a child or key) does nothing a SizedBox cannot, and SizedBox has a const constructor, so it is cheaper and clearer for spacing. The rule fires when a Container has no positional arguments, at least one of width/height, and no named arguments other than width, height, child, or key.

Invalid

example.dartdart
// Bad: a Container used only for width/height whitespace.
import 'package:flutter/material.dart';

Widget b0() => Container(width: 10);

Widget b1() => Container(height: 20);

Widget b2() => Container(width: 10, height: 20);

Widget b3() => Container(width: 10, child: Text('a'));

Widget b4() => Container(height: 20, child: Text('b'), key: Key('k'));

Widget b5() => Container(width: 5, height: 5, child: SizedBox());
Use a SizedBox to add whitespace to a layout instead of a Container.
3
4Widget b0() => Container(width: 10);
Use a SizedBox to add whitespace to a layout instead of a Container.
5
6Widget b1() => Container(height: 20);
Use a SizedBox to add whitespace to a layout instead of a Container.
7
8Widget b2() => Container(width: 10, height: 20);
Use a SizedBox to add whitespace to a layout instead of a Container.
9
10Widget b3() => Container(width: 10, child: Text('a'));
Use a SizedBox to add whitespace to a layout instead of a Container.
11
12Widget b4() => Container(height: 20, child: Text('b'), key: Key('k'));
Use a SizedBox to add whitespace to a layout instead of a Container.
13
14Widget b5() => Container(width: 5, height: 5, child: SizedBox());

Valid

example.dartdart
// Good: Containers with real layout properties, or non-Container widgets.
import 'package:flutter/material.dart';

Widget g0() => Container(color: Colors.red, width: 10);

Widget g1() => Container(child: Text('a'));

Widget g2() => Container();

Widget g3() => Container(padding: EdgeInsets.zero, height: 10);

Widget g4() => SizedBox(width: 10, height: 10);

Widget g5() => Container(width: 10, decoration: BoxDecoration());

Widget g6() => Container(alignment: Alignment.center, width: 5, child: Text('b'));

How to configure

Set the severity of sized-box-for-whitespace in your falcon.json:

falcon.jsonjson
{
  "linter": {
    "rules": {
      "performance": {
        "sized-box-for-whitespace": "error"
      }
    }
  }
}

Related