Can my DOM library build a real working social media app?

We’ve all been there—stuck in the endless loop of massive frontend frameworks, massive bundle sizes, and complex state management just to build a standard web app.

So, I decided to take a step back and build my own frontend DOM library named NanoScript. It’s lightweight, fast, and stays close to native vanilla JS speed. But I wanted to see if it could actually handle a heavy, real-world workload.

Could a custom DOM library build a fully functioning social media app?

To find out, I built Vlox. And it actually works.

---

What is Vlox?

Vlox is a fully working social media platform powered entirely by NanoScript on the frontend. I didn't want to just build a basic "to-do list" app; I wanted to push the library to its absolute limits with features that production apps actually need.

Here is what's currently running under the hood in Vlox:

• Full Auth Flow: Working login, signup, and logout sessions.
• Dynamic Feed: Creating, loading, and interacting with posts.
• Images Hall: A responsive, media-heavy grid gallery.
• Live Counters: Real-time updates for engagement and metrics without tanking performance.

---

Why NanoScript?

The goal behind NanoScript wasn't to reinvent the wheel, but to make DOM manipulation and frontend code clean without the bloated boilerplate of modern build tools.

• Zero Bloat: It keeps your initial page loads incredibly fast.
• Fast Rendering: Highly optimized for updating fast-paced feeds (like the Vlox image gallery).
• Simple Syntax: Handles event listeners and reactive UI updates with minimal code.

---

Check out the code 🖥️

Both the library, the concepts behind it and Vlox are completely open-source. If you want to see how the DOM manipulation works under the hood or check out the architecture, you can find the repository here:

👉 NanoScript on GitHub

👉 Vlox on GitHub

Take a look, test it out, and let me know what you think! If you find it interesting, a star on the repo would be massive.

Drop a comment below if you have any questions!

Comments

[Frank]

I'm curious how you tackled user authentication and

[Seif Ahmed]

Hey Frank!

Here is how I handled user login authentication:

1. The user enters their credentials (a username and a password).
2. The system checks if a document with that username exists using findOne in Mongoose.
3. If there is no account associated with that username, it sends a 401 status error with the message "Invalid username or password".
4. If the account exists, I use the compare method in bcrypt: await bcrypt.compare(password, user.password).
5. If it doesn't return true (meaning a wrong password), it sends a 401 status error with the message "Invalid username or password".
6. If it matches, it sets both req.session.isLoggedIn = true and req.session.userId = user._id, then it returns a 200 success message.
7. Congrats! You are logged in!