Like most developers, I once believed a portfolio had to be flashy.
More animations • More motion • More “wow”
And somehow… a Lighthouse score of 62 😅
So this time, I did the opposite.
👉 Portfolio: https://sushantrahate.com
(Open it alongside this post if you want context.)
PageSpeed Insights: https://pagespeed.web.dev/analysis/https-sushantrahate-com/vkyra56xl5?form_factor=desktop
The Real Goal
I didn’t want my portfolio to entertain people.
I wanted it to respect their time.
- It should load in milliseconds
- And the moment it appears, the viewer should feel:
“Okay. I know who this person is.”
The first screen is the first impression.
If that moment is unclear, everything after it is noise.
So the first screen explains - without asking you to scroll:
- who I am
- what I do
- what I’m building
No telling. Only proof.
“Talk is cheap. Show me the code.” - Linus Torvalds
My Constraints (Intentionally Self-Imposed)
Before writing a single line of code, I set strict rules:
- ⚡ 100% Google Lighthouse performance
- 🧠 Only essential information
- 🚫 No heavy frameworks
- 🚫 No animations to wait for
- 🚫 No component libraries
- 🚫 No guessing
- 🚫 No effort required from the viewer
- ✅ Fast even on slow networks
The Layout: Compact by Design
Once I knew what to show, I focused on how.
I chose a bento grid layout - compact, high-signal information density.
People don’t read websites line by line.
They scan, usually in a Z-pattern:
top-left → top-right
then diagonally down
then left → right again
So I placed sections deliberately to match that flow.
1. Starting With the Human
The page begins with who I am.
- I mention JavaScript, not a long list of frameworks
(tools change, fundamentals don’t) - I mention backend and security
(that’s how I think when building systems) - I end with a small personal line - husband, dad
to remind there’s a human behind the code
No fluff. Just context.
2. What I’m Actually Building
At the top, I show what I care about right now:
MatriProfile - my live SaaS
A modern, multilingual, privacy-first marriage biodata generator -
built end-to-end by me.
Shipping a real product teaches more than any tutorial or side project ever will:
product thinking, user behavior, trade-offs, and long-term maintenance.
3. Proof Over Promises
I first heard this line in The Social Network, and it stuck:
“Talk is cheap. Show me the code.”
Instead of listing skills, I show repositories.
One of them:
👉 https://github.com/sushantrahate/express-typescript-prisma-postgresql
⭐ It has 27 GitHub stars - but more importantly, it has intent.
It’s a production-ready backend starter focused on:
- clean architecture
- TypeScript discipline
- real-world backend patterns
4. Writing for Clarity
I also link to articles I’ve written.
Because writing exposes understanding.
If I can explain authentication, access control, or backend trade-offs in simple words,
it means I’ve wrestled with those concepts long enough to earn clarity.
Finally, social links sit at the bottom.
The Tech Stack
- HTML
- Tailwind CSS
- Vanilla JavaScript
JavaScript is loaded with defer, so it never blocks rendering.
<script src="./script.js" defer></script>
Fetching GitHub stars is handled carefully:
- The API call runs only after the page has fully loaded
- First paint stays untouched
Closing Thought
A portfolio doesn’t need to explain everything.
It just needs to make the right impression - fast
and give the viewer clear paths to go deeper if they want to.
Mine isn’t a big portfolio.
It’s simple, clean, and intentional.
And sometimes, boring is exactly what works.
GitHub URL: https://github.com/sushantrahate/portfolio
I hope this guide helps you. Happy coding! 😄