I'm creating a website using flutter with most of the content being fetched from Firebase Firestore and storage. I want to host it using firebase hosting. I'm very new to this so I really need to know if SEO will work here.. and if not is there a way for SEO to work without changing the 3 conditions above?

  • What are your concerns that SEO might not work?
    – Steve
    Jan 9 at 7:19

Firebase and Firestore should have little effect on SEO. As long as your site loads quickly, the technologies that you use server side and where your site is hosted shouldn't impact SEO.

Flutter is a different story. I would be very wary of using Flutter for a website where you would like to have the content indexed by search engines. Flutter is client side rendered. Its biggest selling point is that it can render the same experience on the web and in mobile apps for various platforms. However, client side rendering on the web is an SEO minefield.

To start with, any client side rendered website can only be indexed in Google right now. Other search engines like Bing, Baidu, and Yandex don't have bots that are capable of rendering, crawling, and indexing client side. Social media bots from Twitter and Facebook won't be able to generate previews for your URLs when they are shared on those platforms.

Even for Google, you need to be design your client side rendered website so that Googlebot can access it:

  • It can't be a "single page application" (SPA.) Google expects every piece of content to have its own URL to which it can direct visitors from search. With most SPA frameworks you can work around this by using pushState to change the URL when the content changes while preserving the experience of a single page for users (no full page reloads). I would recommend using the path URL strategy in Flutter rather than the default hash URL strategy because it looks like it supports more SEO friendly URLs with pushState.
  • You need to update page titles and meta tags when the URL changes.
  • Links have to be rendered into the document object model (DOM) as <a href="..."> nodes so that Googlebot can find and crawl all the pages on your site. Googlebot doesn't simulate any user actions on pages such as clicking, moving the mouse, or scrolling. If navigation for users is done only in click events, Googlebot won't be able to crawl the site. Googlebot scans the DOM for links. Clicks on those links can be intercepted for users and the content loaded client side so that the SPA experience isn't diminished. I don't know the technical details about how to do this in Flutter.
  • When Googlebot has to render everything client side it can take Googlebot extra weeks or months to index your site initially, index new pages as you create them, and index changes to existing pages. Many SPA frameworks have server side rendering (SSR) modules that pre-render the site to HTML/CSS on the server and eliminate the need for client side rendering for each initial page load. SSR makes the site accessible to all bots (not just Googlebot) and speeds up indexing in Google. From what I've been able to research, there is no SSR for Flutter.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.