And to help form the business case for investing the time to make this type of “how to” available…
TLDR: sharing the best practices here will lead to new business, from me and probably others.
I was previously under the assumption that I would use WeWeb only for the webapp portion of my application, but would be stuck using something else for my main content pages (home page, blog, etc) for the purpose of optimizing for performance and page ranking.
Seeing your well-optimized pages makes me think it’s possible for my entire site to be built on WeWeb without any performance sacrifices.
That will mean a new subscription from me, as I intend to keep the webapp and content portions of my site in separate packages, deployed on separate subdomains.
I suspect I’m not the only one here. I’m eager for you to take my money - show me how!
Unfortunately, the Lighthouse scores of WeWeb apps don’t perform quite so well (yet! )
When you click publish, WeWeb generates a Single-Page Application with a bundle of files inside a js app. As a result, the content is not there on page load.
Lighthouse scores don’t like that.
We pre-render the static content, i.e. content that is hard-coded on your app or bound to a static collection. That improves Lighthouse scores but doesn’t beat tools that are specialized in SEO.
If SEO is a primary concern, we recommend you use a specialized tool like Webflow or Vuepress. This is what we do for our own SEO-focused projects like the website or user docs.
WeWeb really shines when user interactivity and applicative features are your primary concern. That’s why we built our public roadmap and the upcoming academy in WeWeb.
We know users would love to have only one tool to build all of their frontends but we’re not quite there yet. We’re working on it though! We know it would help a lot of people.
Does that make sense?
That doesn’t mean that there aren’t performance improvements you can make or that we are discarding SEO completely
Here are some things that you can do on your WeWeb apps that will improve its Lighthouse scores and, most importantly, the user’s experience:
follow SEO best practices when building:
** add titles & metadata to all your pages
** add alt text on all your images
** use headings for titles
** use elements with the correct HTML tags (e.g. buttons, select, etc.)
don’t load too much data on the page:
** compress images
** keep your pages short and simple
** avoid superfluous nested containers
** add backend filters on big sets of data
** fetch collections only when you need them
** use linked sections to avoid reloading data the user has already loaded
Let me know if that helps and if you have any further questions. I’d like to write a complete guide on the topic to help you and others build the best performing apps possible
We are also recording 2 video courses for the upcoming WeWeb academy to help you with all of this! Feel free to send me a direct message if you’d like to be onboarded as a beta tester in early March.