“That's it! I'm done with Webflow! It's been nothing but a nightmare. We're moving to a headless CMS, and we're doing it now. No more wasting time!...
For further actions, you may consider blocking this person and/or reporting abuse
Site looks good, but you may want to re-check your scores?
You may have run the desktop checks by mistake (desktop checks are pointless, any site can get 90+ for speed). Run the mobile tests instead. 💗
You were right - and thanks for reaching out to us. We've gone through the webpage and speed it up a bit.
It was mostly about built-time optimizations and tweaking some configs (mostly Sentry, we still have some issues on that side of things - see sentry-javascript#4712.
Now the score is around 75 on mobile and 100 on desktop - still not great, but respectable.
Will update the blog accordingly. Here are the links to the reports: mobile and desktop.
My impression is that reports can vary by location/your own network. I think there are tools that can run similar reports from standardized locations.
Yes, it is quite finicky. But it is at least some sort of an indication. On the other hand, you must not optimize just for the score here but for your actual users of the website.
Thanks for the feedback, good point, working on it! 🎯😄
Good website but I am just curious why you were going with the NextJS? Is it because devs are familiar with it, because it is popular or there are some other arguments?
This is content-heavy website and I don't see why not using Astro for it. It also integrates just fine with PayloadCMS.
Astro is great, no doubt. It is just that we have an entire dev pipeline set up around NextJS. Do you use Astro at your end? Would you recommend we try it out?
I find your reasoning valid - if you have the whole pipeline already done, why reinventing the wheel.
I use both Astro and Next, depending if the project is more content-heavy or more app-like (Astro for content, Next for app).
On the last Astro project I did, I used the island component architecture, its ridiculous how easy it is. You basically have Astro components (it looks like html template where you can pass props) that are static and you can just inject react/solid/svelte/vue/whatever components that are dynamic. Use nanostores with local storage for global state if you need it and that's it. SEO is also easy to setup. Like Next it also has dynamic routing (ex: products/[product].astro).
For data you can use JSON, Markdown, headless CMS, pocketbase, firebase... you get the picture.
On that project Lighthouse is 100, gtmetrix is 100% A grade over all statistics, time to first paint is under 200ms, around 600ms to fully functional page. I am talking about marketing website with lots of products, images and product specifications, adding products to cart, contact form that receives products from cart, inline validation and whatnot.
I recommend you to try it on some small side project to check it out to see if it fits your usual use cases.
Will do, Astro seems to tick quite a lot of checkboxes :)
Im interested in that Astro knowledge @pozda did you learn everything through docs + building? Ty!
@eddsaura - That's the way I learn/try new things, so yeah, a lot of documentation reading, building what I need and fidgeting with already available themes on Astro's website - this provides accelerated understanding on different patterns and setups.
Astro islands and nanostores are very easy to understand from the documentation.
I agree, that would be interesting.
Wow, this website is so modern. I like it!
Thank you for sharing your story! I suppose there are many companies going through this rabbithole...
Let's goooo!
Great case, Payload CMS rocks
Great experience! Thanks for sharing!
Try opening the page on slow connection. The first page view has some flickering which you might want to remove.
Huh, thanks for reporting it. Will check. There is still a few things we need to iron out
Fixed! Thanks for telling us
Nice looking site and I liked reading your thought process. There seem to be some color contrast issues, so you could boost your accessibility by fixing those.
I can totally relate to this! I recently built a headless website for a client where we used WordPress as the CMS and React frameworks like Gatsby and Next.js for the frontend. The performance scores were perfect on both desktop and mobile, and content management was a breeze with WordPress, thanks to GraphQL, static rendering, and PWA integration, which made everything incredibly fast.
However, I can't deny that when it's time to update the styling, it can feel overwhelming. The hardcoded elements and legacy code, especially now that I'm working with TypeScript, can be frustrating to revisit. Sometimes, it's a real struggle!
Lately, I've been exploring WordPress with Elementor, and it’s been a game changer. You can easily clone custom designs from scratch using its builder. While there are some limitations, particularly when you need to extend DOM manipulation with plain JavaScript, I found that incorporating React was surprisingly straightforward. You can register your React component in WordPress using a shortcode and then simply drop that shortcode into the Elementor builder’s plain HTML element.
Now, as a developer, you don’t need to spend all your time updating frontend designs. You can leave content editing to someone else and focus on the engineering side of things—like building React components for more complex DOM manipulation. It’s a great way to balance design updates and development. :)
By the way, I'm still getting great performance scores with WordPress, especially with a few tweaks to comply some accessibility in CSS part. Elementor has also become much more optimized. Honestly, I didn’t even use a CDN or any premium optimization plugins—just a basic, budget-friendly hosting plan. Yet, the speed is still impressive! It's a huge improvement compared to how I used to feel about WordPress in the past when performance was a big issue.
Saludos crack. La verdad, se ve genial tu website. Me gusta mucho el estilo y la diagramación.
Pero tengo que estar en desacuerdo con lo que hablas de rendimiento en Wordpress. Las métricas que generan tu website, tranquilamente se pueden llevar al 98%-100% (Desktop y Mobile) en PageSpeed creando el mismo website en Wordpress haciendo uso de correctas prácticas de construcción.
Y esto es utilizando un hosting económico compartido.
Con un hosting de mejor calidad, Cloudflare y WordPress. Se puede lograr websites con un rendimiento por debajo de 1.5s en MOBILE.
Solo es cuestión de conocer las buenas prácticas de construcción dentro de la herramienta.
Saludos!
I mean, it's so good looking I would let it load.
Is there a loading screen example of before and after?
This looks amazing, well done!
I'm curious about whether you considered just a standard CMS vs. headless?
Standard CMS would lock us into a whatever frontend technology it uses. We wanted to stick to what we know best, which is Next.js. And Payload simply won 😁 you can read more in this blog, though it only considers headless ones.
Do you have any specific CMS in mind?
To be honest - I like the old page better (sorry)
Wait nevermind, the site looks better than the screenshots
I agree, that would be interesting.
not gonna lie, Ziga, the website is so sleek and feels intuitive 😀. I'm curious though—your team seems like the kind I would love to work with.
What would it take to join you?
The site looks good but when scrolling down the site make lags to scroll down. stuck when scrolling i think the bundle of uses of assets is getting this stuck
Nice article. But there's a scrolling issue on my end. Sometimes the page cannot be scrolled with mouse's scroll, and it works fine with touchpad's scroll.
Huh, thanks for reporting - will check
Nice website and UI, but the entire website is lagging and jitterng on Chrome browser!