logo

Imad Attif

Blog

Engineering

Aug 1, 2026

Next.js Rendering Explained: CSR, SSR, SSG, ISR, and PPR

Every Next.js rendering strategy explained: client-side rendering, SSR, static generation, ISR, streaming, and Partial Prerendering with Cache Components.

Engineering

Jul 29, 2026

use cache Explained: Next.js Caching After the App Router

Next.js caching finally makes sense. How the use cache directive, cacheLife, and cacheTag work in Cache Components, with real examples and pitfalls.

Engineering

Jun 22, 2026

UI Design Systems: A Practical Guide for Frontend Engineers

How production design systems work: design tokens, variant-driven components, accessible primitives, package boundaries, and Storybook, with code examples.

Engineering

Jun 17, 2026

Why Software Architecture Matters More in the Age of AI

AI makes writing code cheap. Architectural judgment is now the bottleneck: why module boundaries, ADRs, and lint guardrails matter more, not less.

Engineering

May 6, 2026

Browser Rendering Pipeline Explained: Reflow, Repaint, Compositing

How browsers turn HTML and CSS into pixels: the rendering pipeline, what triggers reflow and repaint, and why transform and opacity animations stay smooth.

Engineering

Apr 15, 2026

Databases for Frontend Developers: A Practical Guide

A frontend engineer's guide to databases: relational, document, key-value, graph, and columnar, when to use each, and how to query them from JavaScript.

Engineering

Mar 27, 2026

State Management in React and Next.js: A Complete Guide

How to manage state in React and Next.js: server vs client state, URL state, when you need Zustand or Jotai, and patterns like optimistic updates.

Engineering

Sep 10, 2025

WebSockets vs SSE vs Polling: How to Stream Data in Real Time

WebSockets, Server-Sent Events, polling, and HTTP streaming compared: how each works, battery and infrastructure costs, and which to use for chat and AI.

Engineering

Aug 4, 2025

Core Web Vitals Explained: What Each Metric Actually Measures

What LCP, INP, and CLS actually measure, the thresholds that count as good, and the highest-impact fix for each Core Web Vital, with code examples.

Engineering

Feb 5, 2025

How to build a table of contents for Sanity in a Next.js website

Learn how to build a Table of Contents (ToC) for a Next.js site using Sanity CMS. This guide covers extracting headings from Portable Text, scroll tracking, and implementing smooth scrolling.