What Changed?
Over the last few days, I made a series of improvements to my homepage project to keep it modern, fast, and maintainable. Here’s a summary of what was done:
1. Dependency Updates
- Updated all npm packages to their latest compatible versions.
- Ensured Tailwind CSS remains on a version compatible with Astro.
- Fixed the RSS feed to include both
.md and .mdx posts.
2. Image Removal
- Removed all
<img> tags and image references from blog posts and components.
- Cleaned up image-related CSS for a leaner codebase.
3. Renderer Simplification
- Removed Preact and its integration, using only React for all interactive components.
- This resolved build warnings and reduced bundle size.
- Optimized Tailwind config for better CSS purging.
- Added
<link rel="preload"> for main CSS and <link rel="prefetch"> for important routes.
- Improved accessibility and SEO by using semantic HTML and a proper
<main> tag.
- Ensured no unnecessary client-side hydration is present.
Why These Changes?
- Performance: Fewer images and a single renderer mean faster loads and smaller bundles.
- Maintainability: Less code and fewer dependencies make the project easier to manage.
- Accessibility & SEO: Semantic HTML and prefetching help users and search engines alike.
Future Goals
Here are some fun ideas and topics I could explore next:
- Personal knowledge base: Integrate a digital garden or Zettelkasten-style notes section.
- Search and filtering: Add full-text search and tag/category filtering for posts and projects.
- Accessibility deep dive: Write a post about the process and tools for making a site truly accessible.
- Fun tools: Add a color palette generator, markdown previewer, or a mini-game.