Flutter Web

Sdílet
Vložit
  • čas přidán 4. 08. 2023
  • Developers, hold on!:.
    Before you begin, I recommend watching this video, which will save you hours of work and perhaps even save your project.
    Flutter cross-platform:.
    Yes, Flutter is cross-platform, but it’s important to understand how things work. Would you microwave a pizza just because it heats up? You would probably prefer the oven. Just because the microwave heats up doesn’t mean it bakes good pizzas.
    How dose it work?:.
    The same goes for Flutter Web. Although Dart compiles fully to JavaScript, which is very convenient for building websites, it should be noted that it compiles to one file, main.dart.js(which can be split, as I will explain later). The problem with this is that beyond the small code you write, Flutter also needs to import all the heavy material and other libraries, which means that the file size starts at 1.4MB (which is already very large for a website). Relatively large Flutter code can easily reach 5-10 MB.
    Web renders:.
    Flutter has two renders:
    HTML render - a weaker render mainly designed for sites without complex functionality.
    CanvasKit :- runs the site exactly like the app, and there’s no problem doing complex things, but there is a price to pay. Flutter uses very heavy libraries to run the graphics properly, so the render load time will be between 8-10 seconds longer than the HTML render.
    The loading time of canvasKit is a price that cannot be paid when dealing with a website and not a software application. Of course, there is a third option to let Flutter choose what to serve, but it’s not relevant at the moment, and I will expand on it in the future.
    Remember this:
    When you want to build a site in Flatter, it almost always has to be in html render, so it is important to pay attention to keep the files as small and fragmented as possible by using “deferred as” for import.
    But it important to note that the site will not be SEO friendly until flutter team will fix it out (pretty funny that this is a product problem that Google wrote, isn’t it?).
    Ok, so.. how to choose the right way?.
    If you have a small website without an urgent need to appear in a Google search in an optimal way, Flutter is here to help you! In any other case, I would recommend another way. If you don’t have the option,
    because it’s not possible to maintain 2 codes or for any other reason, and you’ve already decided to go for Flatter, be sure to use deferred import, and keep the files (including assets) as small as possible.

Komentáře • 1

  • @YTube44

    i am junior flutter developer i need work