Question 79208 in Flutter Question posted in
The official Flutter documentation can be found here.

For Flutter, is it better to wrap only actual changes with setState()?

Is there a difference between wrapping the entire function and only wrapping the actual changes with setState()?

  1. wrapping the entire function

    setState(() {
   if (switchValueAdd) {
     valueAdd.text = (int.parse(num1) + int.parse(num2)).toString();
   } else {
     valueAdd.text = '';
   }
 });

  2. wrapping only actual changes

if (switchValueAdd) {
setState(() {
    valueAdd.text = (int.parse(num1) + int.parse(num2)).toString();
});
} else {
setState(() {
    valueAdd.text = '';
});
}

Is there any difference in terms of performance between the above two code snippets?
Any help will be appreciated!

Also, with if-else statements, does ‘else’ cost as much memory as ‘if’?
In other words, is ‘else’ basically the same as ‘if’ but checking if otherwise is true?

Thank you for your effort and time in advance!

Tags:

3

Answers


  1. 0

    It is not difference. setState called only in one case (from if or else, not from both). But if you will have to write readable code, use first variant because it is more readable. And statements is not a high-performance operation.

    You can also simplify thin:

    valueAdd.text = switchValueAdd
  ? (int.parse(num1) + int.parse(num2)).toString()
  : valueAdd.text = '';
    Login or Signup to reply.
  2. 0

    You can refresh state after executing all code of function so, it will reduce refresh build many times and improve performance of app.

        valueAdd.text = switchValueAdd
        ? (int.parse(num1) + int.parse(num2)).toString()
        : valueAdd.text = '';

        /* All your other code which is need to manage state */

        setState((){}); // call after all code executed of function
    Login or Signup to reply.
  3. 0

    Functionally, putting non-asynchronous code within the setState or putting it outside will result in very close to the same result. What you should try to avoid is having a huge block of code within the setState as this could be hard to read.

    If you look at the source code for the setState method, it is just calling the function and doing a few asserts, so if you are doing the same amount of calls to it, it shouldn’t have any appreciable difference. Theoretically, it could be very slightly slower if you are accessing local variables from within the closure, as those variables (or at least the references to them) could need to be copied through the stack into the function, but the actual overhead that will result in would need someone with a more complete understanding of dart’s compiler for various platforms to fully explore.

    Realistically, in terms of actual real-world performance, it’s very unlikely to matter. There are probably other optimizations in your code which would result in much larger performance variance than this.

    Also, from the setState documentation:

    Generally it is recommended that the setState method only be used to wrap the actual changes to the state, not any computation that might be associated with the change. For example, here a value used by the build function is incremented, and then the change is written to disk, but only the increment is wrapped in the setState:

    Future<void> _incrementCounter() async {
 setState(() {
   _counter++;
 });
 Directory directory = await getApplicationDocumentsDirectory();
 final String dirName = directory.path;
 await File('$dir/counter.txt').writeAsString('$_counter');
}

    I would focus more on legibility in this case – whichever version you find easier to read is probably the one that will serve you best.

    I’d probably write it like this:

    setState(() {
  valueAdd.text =
      switchValueAdd ? (int.parse(num1) + int.parse(num2)).toString() : '';
 });
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search