The Problem
As a Discord power user, I constantly need to generate dynamic timestamps (like <t:1735689600:R>) for event announcements.
Most existing tools have two problems:
- They are loaded with aggressive ads.
- They are slow and unoptimized for mobile phones.
I decided to fix this by building my own open-source alternative: DiscTimestamps.
The Tech Stack
I wanted this project to be blazing fast and completely privacy-focused.
- Framework: React + Vite
- Styling: Tailwind CSS
- Icons: Lucide React
- Hosting: Vercel/Netlify (Static)
Optimizing for Performance (Hitting 98+ on Mobile)
My goal was to hit a perfect 100 on Google Page Speed Insights. Here is how I did it:
1. Smart Lazy Loading
I used React's lazy and Suspense to split the code. If you visit the Home page, you don't download the code for the "Embed Builder" or "Emoji Downloader" until you actually click those tabs.
2. Non-Blocking Fonts
I used the font-display: swap strategy to ensure text is visible immediately, rather than waiting for the font file to download.
3. Deferring Heavy Scripts
Google Tag Manager was blocking the main thread by ~150ms. I moved it to load after the main content is interactive, using a custom delay script.
The Result
The site now scores 98-100 on Mobile Performance and 100 on Accessibility.
Features
It’s not just a timestamp generator. I expanded it into a full suite:
- Timestamp Generator: With an AI parser (type "in 2 hours").
- Embed Builder: Visual JSON editor for web hooks.
- Emoji Downloader: Grab custom emojis easily.
Open Source
The project is 100% free and open source. You can check the code or contribute on GitHub.
🔗 Try it live: [https://disctimestamps.com]
💻 GitHub: [https://github.com/disctimestamps/discord-timestamp-guide.git]
Let me know what you think! I'm looking for feedback on the UI.
Top comments (0)