1 Commits

Author SHA1 Message Date
google-labs-jules[bot]
d817d42174 perf(effects): reduce GC pressure in GradientBlinds animation loop
Refactors `GradientBlinds` to use mutable references for pointer position tracking instead of creating new objects on every `pointermove` event and animation frame. This reduces Garbage Collection overhead during high-frequency updates.

- Changes `pointerPosRef` to a stable object with an `active` flag.
- Updates `mouseTargetRef` (array) in-place instead of reassigning.
- Ensures distinct array references for dampening logic to prevent aliasing bugs.

Co-authored-by: ragusa-it <196988693+ragusa-it@users.noreply.github.com>
2026-02-01 02:08:43 +00:00
3 changed files with 157 additions and 181 deletions

View File

@@ -65,7 +65,8 @@ const GradientBlinds: React.FC<GradientBlindsProps> = ({
const rendererRef = useRef<Renderer | null>(null);
const mouseTargetRef = useRef<[number, number]>([0, 0]);
// Optimization: store raw pointer position (viewport coords) to decouple event handling from calculation
const pointerPosRef = useRef<{ x: number; y: number } | null>(null);
// Changed to a stable object to avoid GC pressure in high-frequency event handlers
const pointerPosRef = useRef<{ x: number; y: number; active: boolean }>({ x: 0, y: 0, active: false });
const isMobileRef = useRef<boolean>(false);
const lastTimeRef = useRef<number>(0);
const firstResizeRef = useRef<boolean>(true);
@@ -304,7 +305,8 @@ void main() {
const cx = gl.drawingBufferWidth / 2;
const cy = gl.drawingBufferHeight / 2;
uniforms.iMouse.value = [cx, cy];
mouseTargetRef.current = [cx, cy];
mouseTargetRef.current[0] = cx;
mouseTargetRef.current[1] = cy;
}
};
@@ -332,10 +334,13 @@ void main() {
x = (e.clientX - rect.left) * scale;
y = (rect.height - (e.clientY - rect.top)) * scale;
}
mouseTargetRef.current = [x, y];
pointerPosRef.current = null; // Ensure loop doesn't override
mouseTargetRef.current[0] = x;
mouseTargetRef.current[1] = y;
pointerPosRef.current.active = false; // Ensure loop doesn't override
} else {
pointerPosRef.current = { x: e.clientX, y: e.clientY };
pointerPosRef.current.x = e.clientX;
pointerPosRef.current.y = e.clientY;
pointerPosRef.current.active = true;
}
};
@@ -344,7 +349,7 @@ void main() {
uniforms.iTime.value = t * 0.001;
// Update target based on pointer position and scroll offset
if (pointerPosRef.current) {
if (pointerPosRef.current.active) {
const scale = (renderer as unknown as { dpr?: number }).dpr || 1;
let x, y;
@@ -361,7 +366,8 @@ void main() {
x = (pointerPosRef.current.x - rect.left) * scale;
y = (rect.height - (pointerPosRef.current.y - rect.top)) * scale;
}
mouseTargetRef.current = [x, y];
mouseTargetRef.current[0] = x;
mouseTargetRef.current[1] = y;
}
if (mouseDampening > 0) {
@@ -376,8 +382,13 @@ void main() {
cur[0] += (target[0] - cur[0]) * factor;
cur[1] += (target[1] - cur[1]) * factor;
} else {
if (pointerPosRef.current || isMobileRef.current) {
uniforms.iMouse.value = mouseTargetRef.current;
if (pointerPosRef.current.active || isMobileRef.current) {
// In no-dampening mode, update values directly.
// We copy values instead of assigning the reference to avoid aliasing issues
// (where cur and target become the same array) if dampening is enabled later
// without re-creating uniforms (though currently effect deps handle that).
uniforms.iMouse.value[0] = mouseTargetRef.current[0];
uniforms.iMouse.value[1] = mouseTargetRef.current[1];
}
lastTimeRef.current = t;
}

View File

@@ -1,135 +1,117 @@
export const de = {
// Navigation
nav: {
home: "Startseite",
about: "Über mich",
contact: "Kontakt",
home: 'Startseite',
about: 'Über uns',
contact: 'Kontakt',
},
// Hero Section
hero: {
greeting: "Willkommen bei",
company: "Ragusa IT-Consulting",
tagline: "Websites, die",
rotatingWords: [
"Anfragen bringen",
"Kunden überzeugen",
"messbar performen",
"Ihr Business stärken",
],
cta: "Kostenloses Erstgespräch",
ctaSecondary: "Warum Ragusa IT?",
scroll: "Scrollen",
greeting: 'Willkommen bei',
company: 'Ragusa IT-Consulting',
tagline: 'Ihr Partner für',
rotatingWords: ['Webentwicklung', 'IT-Support', 'Digitale Lösungen', 'Tech-Beratung'],
cta: 'Projekt starten',
ctaSecondary: 'Mehr erfahren',
scroll: 'Scrollen',
},
// Services
services: {
title: "Leistungen mit Ergebnisfokus",
subtitle:
"Konkrete IT-Lösungen, die Zeit sparen und neue Anfragen ermöglichen",
title: 'Unsere Leistungen',
subtitle: 'Professionelle IT-Lösungen für Ihr Unternehmen',
items: [
{
title: "Webentwicklung",
description:
"Conversion-orientierte Websites und Web-Apps, die Vertrauen schaffen und qualifizierte Leads generieren.",
icon: "code",
title: 'Webentwicklung',
description: 'Moderne, responsive Websites und Web-Applikationen mit React, TypeScript und aktuellen Technologien.',
icon: 'code',
},
{
title: "Tech-Support",
description:
"Schnelle Hilfe bei akuten Problemen, damit Ihr Betrieb ohne lange Ausfälle weiterläuft.",
icon: "support",
title: 'Tech-Support',
description: 'Schnelle und zuverlässige technische Unterstützung für Hardware und Software vor Ort.',
icon: 'support',
},
{
title: "IT-Beratung",
description:
"Praxisnahe Entscheidungen für Infrastruktur, Tools und Prozesse passend zu Ihrem Budget.",
icon: "consulting",
title: 'IT-Beratung',
description: 'Strategische Beratung für Ihre IT-Infrastruktur und digitale Transformation.',
icon: 'consulting',
},
{
title: "Hosting & Wartung",
description:
"Stabile Betreuung mit Updates, Monitoring und klaren Verantwortlichkeiten für Ihre Webpräsenz.",
icon: "hosting",
title: 'Hosting & Wartung',
description: 'Zuverlässiges Webhosting, regelmäßige Updates und proaktive Wartung Ihrer Systeme.',
icon: 'hosting',
},
],
},
// About
about: {
title: "Über mich",
subtitle: "Ihr persönlicher IT-Partner",
intro:
"Ich bin Melvin Ragusa und unterstütze als Einzelunternehmer Unternehmen und Selbstständige mit persönlichem IT-Service. Mein Fokus: klare Lösungen statt unnötiger Komplexität.",
experience:
"Mit Erfahrung in Webentwicklung und IT-Beratung helfe ich dabei, technische Herausforderungen schnell und pragmatisch zu lösen.",
title: 'Über uns',
subtitle: 'Ihr lokaler IT-Partner',
intro: 'Ragusa IT-Consulting bietet professionelle IT-Dienstleistungen mit persönlichem Service. Wir kombinieren technische Expertise mit einem tiefen Verständnis für die Bedürfnisse unserer Kunden.',
experience: 'Mit jahrelanger Erfahrung in der Webentwicklung und IT-Beratung unterstützen wir Unternehmen und Privatpersonen dabei, ihre technischen Herausforderungen zu meistern.',
skills: {
title: "Technologien",
subtitle: "Moderne Tools für moderne Lösungen",
title: 'Technologien',
subtitle: 'Moderne Tools für moderne Lösungen',
},
values: {
title: "Warum mit mir arbeiten?",
title: 'Warum Ragusa IT?',
items: [
{
title: "Direkter Kontakt",
description:
"Sie sprechen immer direkt mit mir ohne Umwege oder wechselnde Ansprechpartner.",
title: 'Persönlicher Service',
description: 'Direkter Ansprechpartner für alle Ihre IT-Anliegen.',
},
{
title: "Nahbar & vor Ort",
description:
"Ich bin lokal erreichbar und begleite Sie auf Wunsch auch persönlich vor Ort.",
title: 'Lokale Präsenz',
description: 'Vor-Ort-Support und persönliche Beratungsgespräche.',
},
{
title: "Faire, klare Preise",
description:
"Ich arbeite mit transparenter Preisstruktur ohne versteckte Zusatzkosten.",
title: 'Faire Preise',
description: 'Transparente Preisgestaltung ohne versteckte Kosten.',
},
{
title: "Schnelle Rückmeldung",
description:
"Ich antworte zeitnah auf Anfragen und kümmere mich pragmatisch um Probleme.",
title: 'Schnelle Reaktion',
description: 'Kurze Reaktionszeiten bei Anfragen und Problemen.',
},
],
},
},
// Contact
contact: {
title: "Kontakt",
subtitle: "Lassen Sie uns zusammenarbeiten",
intro:
"Beschreiben Sie kurz Ihr Projekt oder Problem ich melde mich schnell mit einer konkreten Einschätzung und nächstem Schritt.",
title: 'Kontakt',
subtitle: 'Lassen Sie uns zusammenarbeiten',
intro: 'Haben Sie ein Projekt im Sinn oder benötigen Sie technische Unterstützung? Ich freue mich auf Ihre Nachricht!',
form: {
name: "Name",
namePlaceholder: "Ihr Name",
email: "E-Mail",
emailPlaceholder: "ihre@email.de",
subject: "Betreff",
subjectPlaceholder: "Worum geht es?",
message: "Nachricht",
messagePlaceholder: "Ihre Nachricht...",
submit: "Nachricht senden",
sending: "Wird gesendet...",
success: "Nachricht erfolgreich gesendet! Ich melde mich bald bei Ihnen.",
error:
"Fehler beim Senden. Bitte versuchen Sie es erneut oder kontaktieren Sie mich direkt.",
rateLimit: "Zu viele Anfragen. Bitte warten Sie einen Moment.",
name: 'Name',
namePlaceholder: 'Ihr Name',
email: 'E-Mail',
emailPlaceholder: 'ihre@email.de',
subject: 'Betreff',
subjectPlaceholder: 'Worum geht es?',
message: 'Nachricht',
messagePlaceholder: 'Ihre Nachricht...',
submit: 'Nachricht senden',
sending: 'Wird gesendet...',
success: 'Nachricht erfolgreich gesendet! Ich melde mich bald bei Ihnen.',
error: 'Fehler beim Senden. Bitte versuchen Sie es erneut oder kontaktieren Sie mich direkt.',
rateLimit: 'Zu viele Anfragen. Bitte warten Sie einen Moment.',
},
info: {
title: "Kontaktdaten",
email: "E-Mail",
location: "Standort",
github: "GitHub",
title: 'Kontaktdaten',
email: 'E-Mail',
location: 'Standort',
github: 'GitHub',
},
},
// Footer
footer: {
copyright: "© {year} Ragusa IT-Consulting. Alle Rechte vorbehalten.",
madeIn: "Entwickelt in Deutschland mit",
love: "Liebe",
impressum: "Impressum",
copyright: '© {year} Ragusa IT-Consulting. Alle Rechte vorbehalten.',
madeIn: 'Entwickelt in Deutschland mit',
love: 'Liebe',
impressum: 'Impressum',
},
};

View File

@@ -1,135 +1,118 @@
import type { Translations } from "./de";
import type { Translations } from './de';
export const en: Translations = {
// Navigation
nav: {
home: "Home",
about: "About Me",
contact: "Contact",
home: 'Home',
about: 'About',
contact: 'Contact',
},
// Hero Section
hero: {
greeting: "Welcome to",
company: "Ragusa IT-Consulting",
tagline: "Websites that",
rotatingWords: [
"generate leads",
"convert visitors",
"perform measurably",
"support your growth",
],
cta: "Book a Free Discovery Call",
ctaSecondary: "Why Ragusa IT?",
scroll: "Scroll",
greeting: 'Welcome to',
company: 'Ragusa IT-Consulting',
tagline: 'Your partner for',
rotatingWords: ['Web Development', 'IT Support', 'Digital Solutions', 'Tech Consulting'],
cta: 'Start Project',
ctaSecondary: 'Learn More',
scroll: 'Scroll',
},
// Services
services: {
title: "Services Built for Outcomes",
subtitle:
"Practical IT solutions that save time and help you win new clients",
title: 'Our Services',
subtitle: 'Professional IT solutions for your business',
items: [
{
title: "Web Development",
description:
"Conversion-focused websites and web apps that build trust and generate qualified leads.",
icon: "code",
title: 'Web Development',
description: 'Modern, responsive websites and web applications built with React, TypeScript, and cutting-edge technologies.',
icon: 'code',
},
{
title: "Tech Support",
description:
"Fast help for critical issues so your day-to-day operations keep running smoothly.",
icon: "support",
title: 'Tech Support',
description: 'Fast and reliable technical support for hardware and software, available on-site.',
icon: 'support',
},
{
title: "IT Consulting",
description:
"Hands-on guidance for infrastructure, tools, and processes aligned with your budget.",
icon: "consulting",
title: 'IT Consulting',
description: 'Strategic consulting for your IT infrastructure and digital transformation.',
icon: 'consulting',
},
{
title: "Hosting & Maintenance",
description:
"Reliable care with updates, monitoring, and clear ownership for your online presence.",
icon: "hosting",
title: 'Hosting & Maintenance',
description: 'Reliable web hosting, regular updates, and proactive maintenance of your systems.',
icon: 'hosting',
},
],
},
// About
about: {
title: "About Me",
subtitle: "Your personal IT partner",
intro:
"I'm Melvin Ragusa, and I run Ragusa IT-Consulting as a solo business. I help companies and freelancers with hands-on IT support and web solutions — focused on clear, practical outcomes.",
experience:
"With experience in web development and IT consulting, I help businesses and individuals solve technical challenges quickly and pragmatically.",
title: 'About Us',
subtitle: 'Your local IT partner',
intro: 'Ragusa IT-Consulting provides professional IT services with a personal touch. We combine technical expertise with a deep understanding of our clients\' needs.',
experience: 'With years of experience in web development and IT consulting, we help businesses and individuals overcome their technical challenges.',
skills: {
title: "Technologies",
subtitle: "Modern tools for modern solutions",
title: 'Technologies',
subtitle: 'Modern tools for modern solutions',
},
values: {
title: "Why work with me?",
title: 'Why Ragusa IT?',
items: [
{
title: "Direct Contact",
description:
"You always work directly with me — no handoffs and no changing points of contact.",
title: 'Personal Service',
description: 'Direct point of contact for all your IT needs.',
},
{
title: "Local & Accessible",
description:
"I am locally available and can support you on-site when needed.",
title: 'Local Presence',
description: 'On-site support and in-person consultations.',
},
{
title: "Fair, Clear Pricing",
description:
"I work with transparent pricing and no hidden extra fees.",
title: 'Fair Pricing',
description: 'Transparent pricing with no hidden costs.',
},
{
title: "Fast Response",
description:
"I reply quickly and handle issues in a practical, no-nonsense way.",
title: 'Quick Response',
description: 'Short response times for inquiries and issues.',
},
],
},
},
// Contact
contact: {
title: "Contact",
subtitle: "Let's work together",
intro:
"Share your project or issue briefly — I'll reply quickly with a concrete assessment and recommended next action.",
title: 'Contact',
subtitle: 'Let\'s work together',
intro: 'Have a project in mind or need technical support? I look forward to hearing from you!',
form: {
name: "Name",
namePlaceholder: "Your name",
email: "Email",
emailPlaceholder: "your@email.com",
subject: "Subject",
subjectPlaceholder: "What is it about?",
message: "Message",
messagePlaceholder: "Your message...",
submit: "Send Message",
sending: "Sending...",
success: "Message sent successfully! I'll get back to you soon.",
error: "Error sending message. Please try again or contact me directly.",
rateLimit: "Too many requests. Please wait a moment.",
name: 'Name',
namePlaceholder: 'Your name',
email: 'Email',
emailPlaceholder: 'your@email.com',
subject: 'Subject',
subjectPlaceholder: 'What is it about?',
message: 'Message',
messagePlaceholder: 'Your message...',
submit: 'Send Message',
sending: 'Sending...',
success: 'Message sent successfully! I\'ll get back to you soon.',
error: 'Error sending message. Please try again or contact me directly.',
rateLimit: 'Too many requests. Please wait a moment.',
},
info: {
title: "Contact Info",
email: "Email",
location: "Location",
github: "GitHub",
title: 'Contact Info',
email: 'Email',
location: 'Location',
github: 'GitHub',
},
},
// Footer
footer: {
copyright: "© {year} Ragusa IT-Consulting. All rights reserved.",
madeIn: "Made in Germany with",
love: "love",
impressum: "Imprint",
copyright: '© {year} Ragusa IT-Consulting. All rights reserved.',
madeIn: 'Made in Germany with',
love: 'love',
impressum: 'Imprint',
},
};