This is part of Gopher UnderCover Series.

Before discussing about padding bytes let’s first investigate why we need it, in the first place.

For this i am assuming we are having 64 bit architecture machine.

type Foo struct{
 isValid bool
 id int16
 value int32
}

So, How Much Memory Will this struct will take?

bool → 1 bytes, int16 → 2 bytes , int32 → 4 bytes => 7 bytes.

No, this will take 8 bytes memory. But why? it takes extra 1 bytes.

Because there is memory alignment thing, which compiler has to take care about.

To make 8 bytes memory block filled, compiler adds extra padding bytes.

Why This Happen?

From a hardware perspective, have to make sure memory always align in certain boundaries. To minimize amount of operation to get data from hardware.

Let’s don’t follow memory alignment.

In above, Diagram 2bytes of integer is in Block A where rest of 2 in Block B. So, to get data hardware have to perform 2 operation just to get that data, which is waste of 1 cpu cycle. we can have done in 1.

For 1 byte data, it can be place anywhere, when data is more than 1 byte, it have to follow alignment, to make sure we don’t increase operation of hardware to get data.

Alignment make sure, that data store in sequential manner in memory and store in same memory block.

As per size of data type, alignment is assigned by compiler.

int 16 → 2 bytes alignment.

Why Should You Care About?

In most of the cases, you don’t need to care about how this form. But in profiling program some performance issue comes, there you need to care.Some time there may form too much of extra padding bytes.

Let Change our Struct.

type Foo struct{
 isValid bool
 id int64
 value int64
 anotherVal float32
}

There is rule, whichever is larger datatype in struct, alignment will follow that. So, here 8 byte alignment will be allocated.

here, 1 byte + 7 padding bytes + 8 bytes+8 bytes+4 bytes => 28 bytes. we have to take data in 8 bytes but 28 is not divisible by 8. So, we have add extra 4 padding bytes. which makes → 32 bytes.

Which visual representation is something like:

So, we have 11 bytes of padding byte.

There is trick, write struct as largest value at first.

type Foo struct{
 id int64
 value int64
 anotherVal float32
 isValid bool
}

Now, 8 bytes + 8 bytes + 4 bytes + 1 bytes = 21 bytes (which is not divisible by 8) so we add , 21 bytes + 3 bytes = 24 bytes. So we save 6 bytes. By just changing way of defining struct.

Do this if only if it making impact on performance of your program, otherwise you don’t need to do premature optimization.

An antipattern is just like a pattern, except that instead of a solution, it gives something that looks superficially like a solution but isn’t one. - Andrew Koenig

In this article, we will discuss some of anti-pattern practice which makes chaos everywhere in project. Later Project Become difficulty to maintain and other developer might find code difficult to understand.

Spaghetti

Spaghetti is fancier term when the code is unstructured and difficult to understand.This wastes time and energy in finding bugs, and fix them is harder because code has not proper defined structure.

void main() {
  String name = getName();
  greetUser(name);

  int num1 = getNumber("first");
  int num2 = getNumber("second");

  int sum = addNumbers(num1, num2);
  print("The sum of $num1 and $num2 is: $sum");

  int product = multiplyNumbers(num1, num2);
  print("The product of $num1 and $num2 is: $product");
}

String getName() {
  print("Enter your name:");
  return readInput();
}

void greetUser(String name) {
  print("Hello, $name!");
}

int getNumber(String ordinal) {
  print("Enter the $ordinal number:");
  return int.parse(readInput());
}

int addNumbers(int a, int b) {
  return a + b;
}

int multiplyNumbers(int a, int b) {
  return a * b;
}

String readInput() {
  return stdin.readLineSync()!;
}

This how you can follow Spaghetti Pattern in Your Code.

Golden Hammer

Example You have a toolbox where you have hammer, screwdriver, wrench. Each Tool is best for it's own specific work.Now, the hammer is gold platted, it so shinny so you want to use hammer more, like you're attach to hammer.So for everything you hammer because it looks cool.

Each tool perform best in own area. Not using suitable tool for specific task and using tool which you like no matter it perform well or not. It is Golden Hammer Pattern.

It is like using Javascript for Everything like Frontend, Backend, Mobile Development,AI and embedded systems.

Lava Flow

This occurs when the code that is no longer use is present in source code. This leads to unnecessary complexity because, developer don't know whether code is used some where else in codebase. Refactoring code can reduce this. It also Leads to performance issue in application.

Unnecessary Complexity

When Solution for Problem is simple but developer want to flex his skills with writing complexly (Over Engineering). Usually this occur because of lack of experience and not focus on simplicity.

God Class

It occurs when a class does multiple things(Like God), resulting tight coupling and decrease maintainability. It has too many responsibilities and violates single responsibility principle of object oriented programming.

For example a single class , handling authentication of user and handling user blogs, profiles etc.

These are few anti-patterns which developer do in their codebase and this should avoid or face the consequences of it.

My Code was Something like this:

void main() {
    final List<int> ids = [1,5,3,7];
    print("Loop Started");
   ids.forEach((element)async{
     await getDataAsId(element);
   });
  print("Loop Ended");
}

Future<void> getDataAsId(int id)async{
  await Future.delayed(Duration(milliseconds:400),(){
    print("${id*2}");
  });
}

My Code Inside forEach was executed after all code runs, What the heck?

Why This Happened? Let's See

After a Bit of Research, the block of forEach wasn't run at last. forEach was executed at its time not later. What happened was with my Future function.

Array Methods such as forEach execute codes synchronously. That means each time Future is registered in Queue not waited. You cannot wait for Future(promises) inside of arrayMethods.

Behind the scene, it does something like this.

void main(){

final List<int> ids = [1,2,4];  
 print("Loop Started");
  for(int element in ids){
    callback();
  }
  print("Loop Ended");
}
void callback()async{
  await myDatabase();
}
Future<void> myDatabase()async{
  Future.delayed(Duration(milliseconds:500),(){
    print("HI");
  });
}

So, What's the Solution? Let's Discuss It.

Solutions

1# Using Basic Loops

Just use forEach, for, while or do while loop when you need to call Future which you want to wait.

void main() async{
    final List<int> ids = [1,5,3,7];
    print("Loop Started");
    for(int element in ids){
      await getDataAsId(element);
    }
  print("Loop Ended");
}

Future<void> getDataAsId(int id)async{
  await Future.delayed(Duration(milliseconds:400),(){
    print("${id*2}");
  });
}

#2 Store Future and Call All At Once

For this solution, we will map all futures. And run all Future at once.

void main() async{
    final List<int> ids = [1,5,3,7];
    print("Loop Started");
   final List<Future<void>> futures = ids.map((e)=>getDataAsId(e)).toList();
  await Future.wait(futures);
  print("Loop Ended");
}
Future<void> getDataAsId(int id)async{
  await Future.delayed(Duration(milliseconds:400),(){
    print("${id*2}");
  });
}

If you are on Javascript use

await Promise.all(futures);

Not Only Mobile Apps and web apps also need State Management. But Webpage Don't. But Why?

In Single Page Applications UI have to change according to certain data changes. There all UI changes happen on a single page, but in the case of a webpage, it redirects to another statically created webpage such as .php or .html etc. Single Page Applications are dynamic they change as data changes.

But how State Management Solution comes into the picture for this?

In Simple Terms, State Management is Controller for UI, It handles when UI should rebuild.

What State Management Solution Do We Have in Flutter?

1. setState()

   It is provided by Flutter. For Small Projects, it does a great job. When it is called it rebuilds the whole widget.

2. Provider

   The provider is State Management Solution created by Remi Rousselet. By using provider developers have to ability to separate the UI and logic easily. Provider data can be used Anywhere it is not limited to widgets only. It uses an Inherited widget. In short, it depends on the flutter framework.

3. BloC

   Bloc is another State Management Solution for Flutter. It works in Stream, any changes in data immediately rebuild the UI. It is industry standard. Many Developers Prefer Bloc.

4. Riverpod

   Riverpod is Created By the Same Person Who Created Provider. Buy why is need of new package? Because the Provider was dependent on Flutter Framework and it causes issues like the provider not being found. Riverpod is independent from the Flutter framework.

5. GetX

   GetX is widely Popular among beginner Flutter App Developers. It doesn't mean that experienced developer doesn't use GetX. They use it.

So Why there is Fight for Which State Management is Best.

There is no reason to fight over a state management tool. It just an architectural way. You can use any state management tool as you need.

But Don't Use GetX

Many Beginner who comes into Flutter most likely use GetX for State Management. Because it makes everything easy to do. You Can Access Context anywhere beginner find it handy but it is bad practice. For Shake for learning it's good but In Production App GetX may cause memory leaks and context issues.

So, What do I prefer

I prefer Riverpod, It doesn't mean you should also. I recommend you go with Riverpod or BloC. They have good community support. Easy Follow Documentation.