iamSahdeep / seo_renderer

A Flutter Web Plugin to display Text Widget as Html for SEO purpose
MIT License
114 stars 15 forks source link

Another approach that I use in case your curious #22

Open gedw99 opened 2 years ago

gedw99 commented 2 years ago

I used a different solution , which I used for a similar problem.

The content of a flutter web app is not in the flutter web app. It’s coming from the database and static files on the server.

This includes both the static text and images like you would have in your flutter code, and the dynamic text and images that comes from the server anyways.

In the flutter web app it asks for its content from the server and also caches the static content , so it does not have to ask for it again. So it’s really just doing templating client side but not exactly.

when a google ( or other search engine ) not requests a page , it gets a different template on the server and mixes it together with the content and returns it.

This works very well and is a clean solution. But it requires more work I admit.

The mobile flutter app is the same as the web flutter code. It also asks for the static content from the server and then caches it . And for dynamic data is also asks the server for the data.

Often you need to do things like this anyway for apps that need to be in many languages anyway. Called i18n.

If you have used the flutter translation tools you will see that it extracts all static text out of flutter code into an arb and json file. So you just need to put that file on the server. Then when the flutter code runs on the client , it pulls the json file up from the server and binds the text into the flutter code and it all renders.

inages use the exact same trick. You just need to build a flutter AST parser that returns back the images in the same way the text translation does.

The advantage is that your flutter binaries will be quite a bit smaller. Especially if you have lots of static text and images in your flutter code.

i actually stopped using flutter, but not because of the way flutter web works with SEO. I just found flutter to be very immature compared to other systems in rust and golang which do exactly what flutter does.

with golang and rust approaches you have a better language to do complex things . I know that flutter is great but I already knew golang and rust and so using gioui ( golang ) and yew ( rust ) is more efficient for me and other work colleagues.

Anyways I hope the pattern I described above helps other developers using flutter and wishing to get high quality SEO.

you can also output json-ld data to make the google search system even happier.

ljmatan commented 1 year ago

Hi Gerard,

you should be able to do this entirely on the FE side, using Firebase is too complicated.