TipTap (ProseMirror) was causing:
- chunks 1007 (85 KiB) and 3207 (58 KiB) in the initial bundle
- Array.prototype.at/flat/flatMap, Object.fromEntries/hasOwn polyfills
(ProseMirror bundles core-js for these — the 12 KiB legacy JS flag)
- 2+ seconds of main thread blocking on mobile
Fix: move HTML conversion to the server (API route) and pass the
resulting HTML string to the client, eliminating the need to import
richTextToSafeHtml (and transitively TipTap) in any client component.
Changes:
- app/api/content/page/route.ts: call richTextToSafeHtml server-side,
add html: string to response alongside existing content
- app/components/RichTextClient.tsx: accept html string, remove all
TipTap imports — TipTap/ProseMirror now has zero client bundle cost
- app/components/About.tsx, Contact.tsx: use cmsHtml from API
- app/legal-notice/page.tsx, privacy-policy/page.tsx: same
- app/components/ClientWrappers.tsx: change static imports of About,
Projects, Contact, Footer to next/dynamic so their JS is in
separate lazy-loaded chunks, not in the initial bundle
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Framer Motion's initial={{ opacity: 0 }} was rendered as inline
style='opacity:0' in SSR HTML. If client-side JS failed to hydrate
properly, sections stayed permanently invisible.
Removed whileInView scroll animations from About, Projects, Contact.
Modal animations (AnimatePresence) kept as they only render on interaction.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
- Remove hardcoded Dennis Konkol idle quote from rotation
- Double quote pool (5 → 12 quotes per locale)
- Start at a random quote on page load
- Cycle to a random non-repeating quote every 10s instead of sequential
- Fix dev-deploy.yml: postgres:15-alpine → postgres:16-alpine
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Hero: smoother font scaling (text-[2.75rem] -> sm -> md -> lg), smaller
photo on mobile, reduced gaps and padding
- About: responsive bento grid with smaller border-radius, compact hobbies
grid (2-col on mobile), hidden descriptions on small screens
- Projects: wider aspect ratio on mobile (16/10), show tags from sm:,
smoother title scaling
- Contact: compact form inputs, responsive connect links, smaller gaps
- Footer: reduced top padding and gap on mobile
- HomePage: smaller wave separators (h-12 on mobile)
- 404: compact card padding and button sizing
- ActivityFeed: smaller quote text and min-height on mobile
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Added a shimmering Skeleton component. Integrated loading states for Hero, About (Bento Grid), Reading Log, Projects Archive, and Library pages for a premium UX.
Automated CMS content seeding, integrated interactive AI Chat into Bento grid, implemented intelligent idle quote logic, and unified editorial styling across all sub-pages.
Centralized UI labels in Directus, integrated AI Chat and Status into Bento grid, created standalone Books page, and redesigned project sub-pages for consistent high-end aesthetic.
Moved profile photo to Hero for immediate visibility. Rewrote DE/EN translations to be more personal and focused on self-hosting/student identity. Refined Bento grid for better content flow.
Refactored About section to use a responsive Bento Grid layout. Redesigned Hero for stronger visual impact. Implemented floating Island navigation. Updated Project cards for cleaner aesthetic.
Adds a new "Read Books" section below "Currently Reading" in the About
page. Book reviews with star ratings and comments are fetched from a
Directus CMS collection (book_reviews) and displayed with the existing
liquid design system. Includes i18n support (EN/DE), show more/less
toggle, and graceful fallback when the CMS collection does not exist yet.
https://claude.ai/code/session_017E8W9CcHFM5WQVHw74JP34
- Added ShaderGradientBackground component with 3 animated spheres
- Enhanced glass effects with backdrop-blur across all text surfaces
- Improved readability while maintaining colored borders
- Adjusted animation speed and movement parameters for optimal effect
- Created setup-directus-collections.js to automate the creation of tech stack collections, fields, and relations in Directus.
- Created setup-directus-hobbies.js for setting up hobbies collection with translations.
- Created setup-directus-projects.js for establishing projects collection with comprehensive fields and translations.
- Added setup-tech-stack-directus.js to populate tech_stack_items with predefined data.
- Add CurrentlyReading component with beautiful design
- Integrate into About section
- Add German and English translations
- Add n8n API route for Hardcover integration
- Add comprehensive documentation for n8n setup
Move hardcoded labels/strings in About, Projects, Contact form, Footer and Consent banner into next-intl message files (en/de) so content is maintained in one place.
Co-authored-by: dennis <dennis@konkol.net>
refactor: modify layout to use ClientOnly and BackgroundBlobsClient components
fix: correct import statement for ActivityFeed in the main page
fix: enhance sitemap fetching logic with error handling and mock support
refactor: convert BackgroundBlobs to default export for consistency
refactor: simplify ErrorBoundary component and improve error handling UI
chore: update framer-motion to version 12.24.10 in package.json and package-lock.json
test: add minimal Prisma Client mock for testing purposes
feat: create BackgroundBlobsClient for dynamic import of BackgroundBlobs
feat: implement ClientOnly component to handle client-side rendering
feat: add custom error handling components for better user experience
- Implemented ActivityFeed component to display real-time user activity including coding, music, and chat interactions.
- Added GooFilter and BackgroundBlobs components for enhanced visual effects.
- Updated layout to include new components and ensure proper stacking context.
- Enhanced Tailwind CSS configuration with new color and font settings.
- Created API route to mock activity data from n8n.
- Refactored main page structure to streamline component rendering.
denshooter