Web Design and Engineering

Next.js, React, modern CSS, performance, immersive web, frontend architecture.

Pagina 2 di 3

Left, three lit tiles each shown sliding, scaling and fading as faint copies; right, a glowing white wireframe surface of many points in a wave

Web

WebGL o animazioni CSS: quando usare ciascuna (2026)

Le animazioni CSS muovono transform e opacity fuori dal main thread, a costo zero. WebGL ti dà la GPU grezza. Ecco il confine, con i costi di bundle e batteria.

A scattered heap of grey files joined by lines into one lit file, which feeds a text panel whose lines sit exactly inside their dashed outlines

Web

Performance dei web font: un solo WOFF2, zero spostamenti

Una famiglia non ottimizzata aggiunge 500KB e ritarda il testo leggibile. Subset in WOFF2, self-host e fallback con size-adjust: allo swap nulla si muove.

A ring gauge lit for less than half its length, the rest broken into six dark segments, beside six lanes of tasks each with one long white block past a dashed limit

Web

I 6 errori frontend che affossano il punteggio Lighthouse nel 2026

Il Total Blocking Time pesa il 30% del punteggio Lighthouse, ma quasi tutti ottimizzano la metrica sbagliata. Sei errori in produzione e come correggerli.

A dark client tile and a lit server tile joined by one short white line between matching ports of small pills, with a dashed detour through three empty boxes above

Web

RPC type-safe con i Server Actions di Next.js: via il layer API

Un Server Action è già una RPC. Ecco come renderlo type-safe da capo a fondo e validato a runtime, senza route API né tipi di risposta da mantenere.

One tall glowing white screen full of moving shapes beside a grid of nineteen identical grey document pages

Web

Architettura del sito nel 2026: home come app, il resto statico

Quasi tutti i siti trattano ogni pagina come una SPA. Noi facciamo il contrario: la home come applicazione, il resto come documenti statici.

Three closed white rings holding a large painted block, a pointer with a ripple, and stacked bars on their dashed outlines, each above a meter marked in its good zone

Web

Core Web Vitals su Next.js nel 2026: come arrivare in verde

Passi concreti per portare LCP sotto 2.5s, INP sotto 200ms e CLS sotto 0.1 su un SaaS Next.js 16, e come leggere il campo quando Lighthouse mente.

An S-shaped easing curve with a tile repeated along it in fading copies, bunched at the ends; four lit tiles top left, three struck-through outlines bottom right, a scrollbar at the edge

Web

Stack web immersivo nel 2026: Lenis, GSAP, e cosa lasciare fuori

Lenis (3 kB), GSAP gratis da aprile 2025, ScrollTrigger per la matematica dello scroll e le scroll-driven animations native in CSS. Lo stack che usiamo.

On a white ground, nine black concentric rings around a black core, nine dark lines arriving from outside, each stopped at a different ring

Web

TypeScript strict mode: i 9 setting che non disattiviamo mai

strict: true accende 9 controlli e da TypeScript 6.0 è il default. Cosa intercetta ogni flag in produzione, più i 3 flag fuori dal bundle che aggiungiamo.

Two lanes of weekly tile columns: above, six dashed empty weeks then a steady grey block three tiles high; below, lit columns starting at once and varying in height

Web

Agenzia Next.js o team interno: quando conviene ciascuno nel 2026

Un senior Next.js negli Stati Uniti costa 195 mila dollari all'anno carico pieno e sei settimane per arrivare. Un'agenzia parte da 60 dollari l'ora. Dove vince ciascuno.

A brick wall of dark rounded bricks in which thirteen scattered bricks are lit white

Web

Sicurezza Server Actions Next.js: 13 vulnerabilità e i fix 2026

Next.js ha corretto 13 vulnerabilità nel 2026: bypass del middleware, cache poisoning e SSRF. Cosa è cambiato e come mettere in sicurezza le Server Actions ora.

A thin upper lane of small tiles with a dashed empty outline in it, a curved arrow down to the same tile lit on a wide lower lane carrying a block of packages and a long bar

Web

Edge runtime o Node runtime: cosa cambia con Next.js 16

Next.js 16 sposta il middleware sul runtime Node e lo rinomina proxy.ts. Dove Edge resta più rapido e dove Node vince su librerie e processi lunghi.

A lit card at the centre, a cloud of tiny grey chips drifting away and fading to its left, and three clean lines on its right into three stacked white layers

Web

Rimuovere Tailwind dalla produzione: il design system in CSS puro

Dopo anni a far convivere Tailwind con il nostro design system, lo abbiamo rimosso dalla produzione. Ecco l'architettura che lo ha sostituito e cosa è cambiato.

Torna agli Appunti