Start a personal dev blog on your domain for free with Hashnode and grow your readership.
Get Started

Pitfalls when using Stencil Helmet during Prerendering

Originally published on my site: puruvj.dev

I assume that if you're here, you already know a little about StencilJS, if not, check out this super awesome framework.

Back story

When I was building this blog, I was trying to use Stencil Helmet to dynamically add some tags to the <head> tag, and these dynamic tags would show up in prerendered pages. You can even confirm their existence right now, by pressing Ctrl+U key combo or by manually typing view-source: behind the actual URL.

view-source:https://puruvjdev.now.sh

So, what happened was, I made some changes in my code, and my application stopped prerendering. Just like that. It wasn't prerendering.

This wasn't acceptable. Prerendering is absolutely necessary to make a fast and SEO friendly site.

So I dug deep into my git commits, and BAM! There was the culprit, hiding right in the index.html file on the 3rd line. The glorious.....

<title>Something</title>

Or rather, the absence of it. You see, I had deleted the title tag, so I could handle dynamic title management in my components.

The solution

Always keep the title tag in your index.html.

I just added in the title tag and everything started working.

Hope you got something out of this post.

Signing off!

Start a personal dev blog on your domain for free and grow your readership.

3.4K+ developers have started their personal blogs on Hashnode in the last one month.

Write in Markdown · Publish articles on custom domain · Gain readership on day zero · Automatic GitHub backup and more

No Comments Yet