Code review may not be the most exciting task when it comes to programming, but it is certainly necessary. Having your work examined by an extra pair of eyes can help identify potential bugs and coding errors more easily. Moreover, it improves code performance and ensures product quality. There are plenty of tips regarding general code review but, in this article, we’ll focus on the best practices for Flutter code review in particular. But first, let us give you a short Flutter review so you can understand why.
Flutter Code Review
Released in 2017, Flutter is Google’s toolkit for the development of native mobile, web, and desktop apps. The goal behind Flutter is to give developers an ideal cross-platform development framework. Flutter is actually an SDK, which means it provides users with everything they need to create cross-platform apps, such as ready-made widgets, a rendering engine, and testing and integration APIs.
Flutter is also one of the top preferred skills among software engineers which is why today we are focusing on Flutter code review. If you want to know more, you can check out our detailed Flutter review here.
Although saying you need to make sure Flutter naming conventions are followed may sound obvious, the truth is that these are often overlooked. The main advantage of naming conventions is that they make your code more readable. As a matter of fact, the few minutes you might spend reading the code style guides will save you a lot of time and hassle in the future and is an essential part of the Flutter code review. You can find all you need to know about naming conventions to apply to your review here.
When carrying out your Flutter code review, you should also make sure you are segregating your code into the proper folder structures, namely providers, models, screens/pages, utils, etc.
Clean and reusable code
You should also ensure that your code is properly formatted, that you add the necessary comments for documentation, remove unused or commented code, and make code and widgets reusable where possible. These are all things to keep in mind when reviewing the code.
Widget structure and usage
When it comes to widgets during your Flutter code review, you should keep in mind that it is not only possible, but advisable that you split widgets into sub widgets. Moreover, when dealing with a very long list, you should use ListView.builder to improve performance. It is also advisable to use const in widgets for the same reason (you can cache parts of the widget tree to prevent unnecessary rebuilds using Dart const constructors for parts of the child tree).
Building method structure
Another important point is to make sure the build method is pure. Remember that side effects can be triggered by external factors such as route pop/push, screen resize or a parent widget recreating its child. While carrying out your Flutter code review, you should make sure the build method does not include any logic that may trigger an HTTP call or modify any state.
When it comes to package structure, you should keep in mind that you need only a single import that reexports all of the package’s API. Also, Flutter packages shouldn’t have private APIs (except for those prefixed with underscores) and every file in the package should be exported.
Use Dart code metrics
Dart code metrics is a great way to improve quality during your Flutter code review. This static code analysis tool helps you monitor and improve the quality of the code. Some of the metrics you can take a look at include lines of executable code, number of parameters, maximum nesting and cyclomatic complexity. In addition to metrics, the analysis tool also includes linting, i.e. automatic checking of code. This makes Dart code metrics a great friend as far as your Flutter code review goes. You can take a look at the tool’s capabilities in more detail here.