So I started making a browser engine (for fun) a few days ago, it felt kind of inevitable after starting a JS engine, so here we are. Here’s a short rundown. Source code too!

Try it in your browser!

Screenshot of Shadow’s welcome page running inside Shadow (as of writing)

What?

A browser(/web) engine essentially takes in a URL(/etc) and gives you it rendered into a window for you to view and interact with. Shadow does this too, almost entirely from scratch, made in JS. It runs in your browser! Node backend soon™ too? The host browser(/etc) is only used for networking (fetch) and renderer backend (<canvas>).

Components of Shadow

(red = external/not me)

Why make it?

It’s just for fun, no really. Learning too. It will probably never work with 90% of websites, and that’s okay. Also it’s funny to see people react in many forms of “wtf?"

Screenshot of serenityos.org running inside Shadow (left) vs Firefox (right)

Pretty spot on! No list markers yet. Colors are different as UA/browser defined.

Name

As with all my recent projects, the name is because I thought it was kind of funny at the time. Shadow is named after the defunct <shadow> element. I mostly stole this idea from Blink (was it intentional to name it after a dead HTML element at the time?). Also it sounds spooky and mysterious so that’s a bonus I guess?

It supports JavaScript??!

Yes, kind of. This is quite complicated (as you can probably imagine), so I’ll do it in a separate future dedicated post if you’re interested (DM/reply me on twitter).

Why publish it?

Why not? If someone can learn something or just find what I make fun/interesting, that makes me happy :)

But making a new browser engine is impossible!

No. It. Isn’t! (Also I don’t really care how possible/feasible something is.)