Home > Mobile >  How to make a semi flutter application (Partially html, partially flutter)
How to make a semi flutter application (Partially html, partially flutter)

Time:07-12

Flutter is rather slow, however it is the best option for the app portion of my website. (I want to use html for the other parts, like the blogs, or the wiki, or the welcome page) using flutter would make the loading times for those pages slow.

How would I go about trying to accomplish this. Worst case scenario I'd use one subdomain for the app, and another for the rest of the site, and only route those to the flutter app. Is there any other way I could handle this?

CodePudding user response:

There's a couple options, the one you've outlined (subdomain for the app) may be the easiest to implement.

You can embed the Flutter web app in an iframe (may run into iframes limitations depending on what your app is doing)

If you're proficient with Webpack/Vite you may be able to write a configuration to serve your HTML files alongside your Flutter Web files.

If you were wanting to write your HTML/CSS/JS in Dart there's also Jaspr and Zap but they're fairly early days.

CodePudding user response:

webview_flutter is a flutter plugin. We can load web pages by using this widget. It supports both android and ios. By specifying the location of HTML file or the webpage link in initialUrl, you can load a web pages.

# Loading using webpage link    
Widget build(BuildContext context) {
    return WebView(
      initialUrl: 'https://flutter.dev',
    );
  }


# Loading using HTML File stored in assets folder
Widget build(BuildContext context) {
    return WebView(
      initialUrl: 'assets/new.html',
    );
  }

Refer this example section for different ways of loading web pages

  • Related