Changelog

🎬 Procedural Animations Control

Procedural animations (Snake, Spider) now don't start automatically. The user decides whether to see them — this saves battery and resources on low-end devices.

What's new:

• New AnimationPlayer component with performance warning
• Play/Pause buttons for playback control
• Choice saved in localStorage
• Yellow «⚡ High CPU usage» indicator during animation

🛡️ Mobile Device Compatibility

• Safe safeSessionStorage wrapper with try-catch — site works even in incognito mode
• Fixed SecurityError: Failed to read the 'sessionStorage' error

⚡ React Code Optimization

• Removed useEffect with synchronous setState in ProjectsClient — replaced with derived state
• In ThemeSwitcher used useSyncExternalStore instead of useEffect for safe hydration
• All ESLint errors fixed: 5 errors → 0

🎨 UI and Styles

• Responsive main width via clamp(70%, calc(...), 100%)
• Height 100dvh instead of 100% — works correctly on mobile browsers
• New utility class .lh-100
• Menu renamed: «Changes» → «Updates»

🚀 New Changelog Page

Added the «Updates» page (/updates) — a history of all site updates. Now visitors can track how the portfolio evolves.

What's implemented:

• Data structure lib/updates.json with localization support
• Tags for categorization: Feature, Fix, Improvement
• Automatic sorting by date (newest first)
• Date formatting in Russian and English
• HTML rendering of update content

This page is itself the first entry in the changelog — meta, but nice.

🌐 Full Migration to next-intl

The translation system has been completely rewritten using the next-intl library — the industry standard for Next.js App Router.

What changed:

• All texts moved from projects.json to messages/ru.json and messages/en.json
• Removed the getLocalizedString helper — now using useTranslations and getTranslations hooks
• Created i18n/navigation.ts config with defineRouting and createNavigation
• Link and usePathname from @/i18n/navigation automatically work with language prefixes
• Middleware now uses built-in createMiddleware from next-intl
• Fixed provider order: ThemeProvider wraps NextIntlClientProvider

Benefits:

• Type-safe translations
• Automatic language detection via Accept-Language header
• Language choice saved in cookies
• Easy to add a third language — just create messages/de.json

🎨 UI Components Refactoring

The interface has been split into independent components with state preservation between transitions.

New components:

• ThemeSwitcher — theme toggle button with SVG sun/moon icons and smooth rotation animation
• LanguageSwitcher — language switcher with URL and cookie updates
• MainMenu — extracted slide-out menu with navigation, social links, and toggles

Fixed menu behavior:

• Menu no longer closes when switching languages (from /ru to /en)
• Menu state is saved in sessionStorage and survives layout remounting
• Menu closes correctly only when clicking navigation links
• Added pageshow handler to reset state when returning via browser «Back» button (bfcache)

Design:

• SVG icons instead of emojis in theme switcher
• Hover effects with scaling
• Tooltip with current theme name

🐛 Critical Bug Fixes

A series of fixes ensuring stable site operation.

SEO and metadata:

• Fixed literal {lang} and {slug} in canonical URL — now using template strings ${lang} and ${slug}
• Added correct hreflang links for all language versions
• Fixed identical URLs in alternates for different languages

Architecture:

• Split lib/projects.ts into client part (types and utilities) and server lib/projects-server.ts (working with fs)
• Fixed Module not found: Can't resolve 'fs' error in client components
• Added subcategories for «Websites» category in projects.json: Services, Industry, Shops, Furniture, Education, Auto, Business, Saunas

Navigation:

• Fixed active menu item comparison — now accounts for language prefix in URL
• Added browser language detection via Accept-Language header in middleware
• Implemented saving selected language in cookie for 1 year

Data localization:

• Project interface now supports city?: string | LocalizedString
• Added city field localization in ProjectCard via getLocalizedString