Understanding HTTP: Web Communication Foundation

22% LCP reduction. One misplaced directive. The page was a proper async Server Component — fast, clean. Then someone added a filter panel that needed useState and put "use client" on the page component. That one line silently recreated a full CSR waterfall: → Server sends an empty HTML shell → JS bundle downloads and parses → useEffect fires, API call goes out → Content finally appears Nobody decided to build it this way. It accumulated. Fix: push "use client" down to the leaf node. Page becomes a Server Component again. Waterfall gone. LCP dropped a full second from that change alone. The rest: next/dynamic on a Recharts import (100–150KB off the critical path) + Script strategy changes that cut INP from 238ms → 156ms. Final field data: P75 LCP 3.8s → 2.95s. The "use client" boundary is a rendering decision. Misplace it by one level and it costs you seconds. Where in your App Router codebase did "use client" end up higher than it should have? Full write-up in first comment 👇 #NextJS #WebPerformance #React

What happens when you use synchronous code inside an Express route handler? Synchronous code blocks the main thread until the operation is finished. During that time, Node.js cannot move on to other tasks. For example, imagine an Express route that performs a large file read using a synchronous method or runs a CPU-intensive calculation. While that request is being processed, the Event Loop is blocked and other incoming requests have to wait. This means that even if hundreds of users are trying to access your API, a single blocking operation can slow down the entire application. The impact might not be noticeable during development because there are only a few requests hitting the server. However, under real traffic, blocking code can increase response times and make the application feel unresponsive. This is one of the reasons why asynchronous APIs are preferred in Node.js. They allow the server to continue handling other requests while waiting for an operation to complete. Many backend performance issues are not caused by complex architecture problems. Sometimes they come from a single synchronous operation running in a place where the Event Loop is expected to stay free.

𝗥𝗲𝗮𝗰𝘁 𝟭𝟵: 𝗪𝗵𝗲𝗻 𝘁𝗼 𝘂𝘀𝗲 𝘂𝘀𝗲() 𝘃𝘀 𝘂𝘀𝗲𝗘𝗳𝗳𝗲𝗰𝘁 I replaced 3 useEffects with use() in React 19. I had to undo one. Here is what I learned. use() reads a promise in a component. The component waits for the value. React handles the rest. It works for these cases: - Server components passing promises. - Promises in context. It removes useState and useEffect. It removes loading checks. It fails for these cases: - Polling. - Web sockets. - Subscriptions. The rule is simple. use() is for promises with one resolution. It does not handle cancellation. Use useEffect for lifecycle work. Use TanStack Query for network calls. New tools have narrow uses. Do not refactor everything. Test one example first. Source: https://lnkd.in/gjC78Mvq

One frontend pattern I came across recently: Imagine a user opens the same application in multiple browser tabs. If the application relies on WebSockets for real-time updates, each tab will typically establish its own connection. For many applications, that's completely fine. But what if those connections create duplicate subscriptions or unnecessary backend load? While exploring multi-tab architectures, I came across an interesting approach: Instead of every tab maintaining its own WebSocket connection, one tab acts as the "leader" and owns the connection. Other tabs receive updates through browser communication mechanisms such as BroadcastChannel. To coordinate which tab becomes the leader, browser APIs like Web Locks can be used. What I liked about this approach is that it reminded me of patterns from distributed systems, where one participant owns a responsibility and propagates updates to others. What looked like a simple "multiple tabs" problem ended up introducing concepts like leader election and cross-tab communication.

One lesson I've learned from building web applications: Don't trust localhost completely. An application can work flawlessly in a local environment and still encounter issues after deployment. Common reasons include: - Environment variable differences - API configuration issues - Database connection problems - CORS settings - Missing production-specific configurations Local testing is important, but real confidence comes from testing in an environment that closely resembles production. "Works on my machine" is not the same as "Works in production." #WebDevelopment #SoftwareEngineering #Debugging #BackendDevelopment #FrontendDevelopment #DeveloperJourney #BuildInPublic

Most developers use HTTP every day… But very few actually understand how it evolved 👇 Let’s compare HTTP 1.0 vs 1.1 vs 2 in a simple way. 🔹 HTTP 1.0 (The Beginning) One request = one connection Connection closes after every response No reuse of connections Extremely slow for modern websites 👉 Problem: Too many handshakes = high latency 🔹 HTTP 1.1 (The Improvement) Persistent connections (keep-alive) Multiple requests over same connection Chunked transfer supported Pipelining introduced (rarely used properly) 👉 Problem: Still suffers from head-of-line blocking 🔹 HTTP/2 (The Upgrade) Multiplexing (multiple requests in parallel) Single TCP connection per domain Binary protocol (faster + more efficient) Header compression (HPACK) Server push (send data before request) 👉 Result: Massive performance improvement 📊 Big picture: HTTP 1.0 → slow, repetitive connections HTTP 1.1 → better but still limited HTTP/2 → parallel, optimized, modern web-ready The web didn’t get faster because of hardware alone… It got faster because protocols evolved. Next step: HTTP/3 (QUIC + UDP + no TCP bottlenecks) 👀 #WebDevelopment #HTTP #BackendDevelopment #SystemDesign #SoftwareEngineering

Most founders treat switching agent frameworks as a rewrite. That belief is why so many stay locked into the first SDK they tried. Last month I moved the same set of skills onto two runtimes. The port onto Google ADK re-architected the logic into a router and sub-agents and took most of a quarter. The port onto the Claude Agent SDK took an afternoon and about 300 lines of glue. The difference was not the framework. It was where the logic lived. My product's behavior sits in plain markdown files, the kind these runtimes read directly. The Claude SDK discovered them natively, so the actual logic never changed. I wrote a thin web layer around skills that already worked. The honest catch: the cheap migration is the more locked-in one, because that runtime speaks to a single model vendor. The framework that cost more glue, ADK, is the one that can swap providers later. Cheap to move onto is not the same as cheap to move off. So the lock-in question was never which vendor to pick. It was whether my product's value lived in their framework code or in files I own. Keep the logic in portable files, and switching runtimes becomes plumbing, not a rewrite.

Every API is a decision about how two programs hold a conversation. There are only a handful of questions that decision answers, and seven names worth knowing. Learn the questions, and the names choose themselves. https://lnkd.in/deN2X2Wm I cover the intuition behind when to use REST - the Grammar of the Web SOAP - the Formal Contract gRPC - Built for Machines GraphQL - Exactly What You Asked For Webghooks - the Reverse call Websockets - the Open line WebRTC - the Straight Line #APIDesign

One HTTP status code that every backend developer should know: 404 Not Found It simply means: 👉 The server is running 👉 Your request reached the server 👉 But the resource you're looking for doesn't exist Example: You request: /api/users/999 If user 999 doesn't exist, the API may return: 404 Not Found Understanding status codes made debugging APIs much easier for me. Some common ones: ✅ 200 → Success ✅ 201 → Created ✅ 400 → Bad Request ✅ 401 → Unauthorized ✅ 404 → Not Found ✅ 500 → Internal Server Error Knowing what these mean can save a lot of debugging time 🚀 Which status code do you see most often while developing?

𝗪𝗵𝗮𝘁 𝗘𝘅𝗽𝗿𝗲𝘀𝘀.𝗷𝘀 𝗛𝗶𝗱𝗲𝘀 𝗙𝗿𝗼𝗺 𝗬𝗼𝘂 Most people use Express.js. It makes servers easy. Five lines of code and you have a backend. I built a server using only Node.js. No frameworks. No packages. Here is what I learned. - Browsers send hidden requests. Chrome asks for a tab icon called favicon.ico. Express hides this. Raw Node shows you every single request. - Responses have rules. In Express, you use res.send(). In raw Node, you use res.end(). Forget this, and your browser hangs forever. - Routing is simple logic. Express uses routing objects. Raw Node uses if/else statements. It matches the URL and the method. Express is a package of these checks. - Data comes in pieces. Express gives you req.body. Raw Node gives you streams. Data arrives in small chunks. You must collect these pieces and glue them together. This prevents memory crashes. Build a raw server today. It changes how you see your tools. It connects code to system architecture. Source: https://lnkd.in/gMx45r-j