Topic
330 posts tagged “Web Development”.
Takina · · 4 min read Structural typing checks shape, not name — TypeScript treats two differently-named types as compatible if their members match, unlike nominal systems.
Takina · · 4 min read CSS subgrid lets a nested grid item inherit its parent's track sizing, so children can align to the same columns or rows across unrelated containers.
Takina · · 4 min read Content negotiation lets a client and server agree on a response's format, language, or encoding using Accept headers, before any body is sent.
Takina · · 3 min read Import attributes let JavaScript modules declare a resource's expected type at import time, such as JSON — catching mismatches before code runs.
Takina · · 4 min read The :focus-within pseudo-class styles a parent element when any descendant has focus — perfect for highlighting a form field's container.
Takina · · 4 min read The Streams API lets JavaScript process data as chunks arrive instead of buffering it all in memory. How ReadableStream, WritableStream, and pipes work.
Takina · · 4 min read Workspaces let npm and pnpm manage multiple packages in one repository, sharing a single dependency tree and letting packages reference each other locally.
Takina · · 4 min read The CSS field-sizing property lets form controls like textareas grow to fit their content automatically, without JavaScript resize listeners.
Takina · · 4 min read The Web Locks API lets JavaScript acquire named locks shared across tabs, so only one tab does work like a token refresh or a write at a time.
Takina · · 3 min read CSS now styles scrollbars natively with scrollbar-color and scrollbar-width, replacing years of vendor-prefixed hacks. Here's how they work.
Chisato · · 4 min read The Trusted Types API blocks DOM-based XSS by forcing risky DOM sinks like innerHTML to accept only vetted objects instead of raw strings.
Takina · · 4 min read CSS color-scheme tells the browser which themes a page supports so native form controls, scrollbars, and UI render in dark mode without extra CSS.
Takina · · 4 min read Svelte 5 runes like $state and $derived replace the old reactive-assignment magic with explicit function calls that work anywhere in a file.
Takina · · 5 min read Variance decides when TypeScript accepts Array<Dog> where Array<Animal> is expected — covariant, contravariant, or invariant, explained with examples.
Takina · · 4 min read The CSS accent-color property recolors native checkboxes, radios, and range inputs without replacing them with custom-built controls.
Takina · · 4 min read The inert attribute removes an element and its children from focus, click handling, and screen reader access in one line, without hiding it visually.
Takina · · 4 min read A shallow copy duplicates an object's top-level properties but shares nested references; a deep copy duplicates everything recursively. How to do each.
Takina · · 4 min read Canvas draws immediate-mode pixels you redraw yourself; SVG keeps a live, styleable DOM of vector shapes. Here's how to pick between the two.
Takina · · 5 min read toSorted(), toReversed(), toSpliced(), and with() copy an array instead of mutating it, fixing a long-standing footgun in JavaScript's Array API.
Takina · · 4 min read A variable font packs every weight, width, and style into a single file, controlled with CSS — cutting requests and enabling fluid typography.
Takina · · 3 min read A SharedWorker runs one script shared across every tab and window of the same origin — a single background thread they can all connect to and message.
Chisato · · 6 min read CVE-2026-19949, an unauthenticated SQL injection in All-in-One WP Migration, exposes 3 million WordPress sites to remote code execution. Patch to 7.110.
Takina · · 4 min read BEM and utility-first CSS (Tailwind's model) solve the same styling problem in opposite ways. How each works, and when to reach for one over the other.
Takina · · 5 min read shape-outside lets text wrap around circles, polygons, and image silhouettes instead of a floated element's rectangular box. How it works, with examples.
Chisato · · 4 min read A man-in-the-browser attack uses malware inside the browser itself to alter what a user sees and submits, bypassing HTTPS and session protections entirely.
Takina · · 5 min read Zod infers static TypeScript types directly from its schemas; Yup was built for JavaScript form validation first. How the two approaches differ.
The Lycoris Team · · 5 min read ISR lets a static page be rebuilt in the background after deploy, on a timer or on demand, without a full site rebuild. How it works and its tradeoffs.
Takina · · 5 min read A .d.ts file describes a library's types without its implementation. How TypeScript declaration files work, and how to write one for an untyped JS package.
Takina · · 4 min read CSS trig functions like sin(), cos(), and atan2() let you compute angles and coordinates directly in stylesheets, no JavaScript required. How they work.
Takina · · 4 min read A TypeScript tuple is a fixed-length array where each position has its own type. How tuples work, labeled elements, and when to use them over arrays.
Takina · · 5 min read ResizeObserver watches an element's size; IntersectionObserver watches its visibility. Both replace scroll/resize listeners — here's when to use each.
Chisato · · 5 min read A CAPTCHA is a challenge designed to be easy for humans and hard for automated scripts. How image, text, and invisible CAPTCHAs actually distinguish the two.
Takina · · 3 min read overscroll-behavior stops scroll chaining and pull-to-refresh bounce at a container's edge. How the property works and when to use it.
Chisato · · 5 min read LLM chat interfaces stream tokens as they're generated using Server-Sent Events, so users see text appear immediately instead of waiting for the full reply.
The Lycoris Team · · 5 min read CSRF forges a request using a victim's login session; XSS runs the attacker's own code inside the victim's browser. Different mechanisms, different fixes.
Takina · · 4 min read Astro content collections give markdown and MDX files a type-safe schema and a query API, catching bad frontmatter at build time instead of runtime.
Takina · · 4 min read The Server-Timing HTTP header exposes backend performance metrics — database time, cache hits — directly in the browser's DevTools network panel.
Takina · · 4 min read CSS pseudo-classes like :valid, :invalid, :required, and :user-invalid style form feedback natively, without JavaScript watching every keystroke.
Takina · · 4 min read JavaScript private class fields use a # prefix to enforce true encapsulation at the language level, hiding state that closures and underscores never could.
Takina · · 5 min read The CSS contain property tells the browser an element's layout, paint, or size won't affect the rest of the page — unlocking safe, targeted rendering shortcuts.
Chisato · · 4 min read Nginx and Apache both serve HTTP traffic, but Nginx's event-driven model and Apache's process-per-connection design lead to real differences under load.
The Lycoris Team · · 4 min read Vim and Emacs are the two long-lived terminal editors, built on opposite philosophies — modal editing vs an extensible Lisp environment. How they actually differ.
Takina · · 4 min read An index signature lets a TypeScript type describe objects whose keys aren't known in advance. How the syntax works, and when to reach for a Record instead.
Takina · · 4 min read The overflow property controls what happens when content doesn't fit its box. A rundown of visible, hidden, scroll, auto, and clip — and when to use each.
Takina · · 3 min read The CSS filter property applies blur, brightness, contrast, grayscale, and other graphical effects directly to an element, no image editor required.
The Lycoris Team · · 4 min read A headless CMS stores and serves content through an API, with no built-in templating or frontend. Why teams split content management from presentation.
Takina · · 4 min read JavaScript's iterator helper methods bring map, filter, and take directly to iterators, so lazy sequences no longer need a library or a manual loop.
Takina · · 4 min read JavaScript's Reflect object mirrors fundamental object operations as functions, designed to pair with Proxy traps and simplify metaprogramming.
Chisato · · 4 min read Insecure deserialization lets attackers turn a trusted object format into remote code execution. How the attack works and how to prevent it.
Takina · · 4 min read The Navigation API gives JavaScript a structured way to intercept and control browser navigations — a modern alternative to the History API.
Takina · · 4 min read CSS @supports lets a stylesheet test whether a browser supports a property or selector before using it. How feature queries work and when to reach for them.
Takina · · 3 min read Array.sort() converts elements to strings by default, so numbers sort out of order. Here's why, and how a compare function fixes it.
Takina · · 4 min read WebTransport is a browser API for low-latency, bidirectional client-server messaging over HTTP/3. How it works and when to reach for it.
Takina · · 4 min read Outline and border both draw lines around an element, but only one affects layout. Here's when to use each, including for accessible focus states.
Chisato · · 4 min read A path traversal attack manipulates file paths like ../../etc/passwd to read files outside a web app's intended directory. How it works and how to stop it.
The Lycoris Team · · 4 min read HTTP methods signal intent — read, create, replace, update, or remove — and that intent determines caching, idempotency, and safety guarantees.
Takina · · 5 min read The BroadcastChannel API lets same-origin tabs, windows, and workers pass messages to each other instantly, with no server round trip or polling.
Chisato · · 4 min read A magic link authenticates a user by emailing a single-use, expiring URL instead of checking a password. How the flow works and its real tradeoffs.
Takina · · 4 min read useMemo caches a computed value; useCallback caches a function reference. Both skip work on re-render, but they memoize different things.
Takina · · 4 min read position: sticky toggles between relative and fixed based on scroll position within its containing block — no JavaScript scroll listener required.
Takina · · 4 min read Robots.txt tells crawlers what not to fetch; sitemap.xml tells them what exists. How the two files work together, and where each one fails.
Takina · · 4 min read setTimeout runs a callback once after a delay; setInterval repeats it on a fixed cadence — but drifts under load in ways setTimeout recursion avoids.
Takina · · 4 min read TypeScript is JavaScript plus a compile-time type system — same runtime, different guarantees. Where each one wins and how they fit together.
Takina · · 3 min read JavaScript's Set object now has built-in union, intersection, difference, and subset methods — replacing manual loops for combining collections.
Takina · · 5 min read Top-level await lets a JavaScript module pause at import time without wrapping code in an async function. How it works and when it bites.
Takina · · 4 min read A design token is a named, platform-agnostic value — a color, spacing unit, font size — that keeps design and code in sync across a product.
Takina · · 5 min read Hydration re-runs a framework's JS to attach interactivity after render; resumability serializes state so the browser can skip that work.
Chisato · · 3 min read A subdomain takeover happens when a DNS record points to a service you no longer control, letting an attacker claim it and serve their own content.
Takina · · 3 min read grid-auto-flow: dense reorders grid items to fill leftover gaps automatically — how it works, when to use it, and the accessibility tradeoff it hides.
Takina · · 5 min read Nx and Turborepo both speed up monorepo builds with caching and task graphs — the real difference is scope, plugins, and how much structure you want.
Takina · · 4 min read Strict mode turns silent JavaScript mistakes into thrown errors and closes off unsafe legacy behavior. Modules and classes use it by default.
Takina · · 4 min read Stale-while-revalidate serves a cached response instantly while fetching a fresh one in the background, so no request waits on the network.
Chisato · · 5 min read Validation rejects bad input, sanitization removes the dangerous parts, and escaping neutralizes them for a specific output context. Most bugs mix these up.
Takina · · 4 min read BigInt is JavaScript's built-in type for whole numbers beyond Number's safe limit. How the syntax works, what it can't do, and when you actually need it.
Takina · · 4 min read Semantic HTML elements like nav, article, and main describe meaning, not just appearance, improving accessibility and SEO. How to use them.
Takina · · 4 min read esbuild, Rollup, and webpack all bundle JavaScript, but trade off speed, configurability, and output shape differently. Which fits which project.
Takina · · 4 min read JavaScript frees memory automatically by tracking reachability, not reference counts. How the mark-and-sweep algorithm works and what causes leaks anyway.
Chisato · · 4 min read Session hijacking steals a valid session token to impersonate a logged-in user without a password. How attackers do it and how to stop it.
Takina · · 4 min read Long polling holds an HTTP request open until new data arrives, faking real-time updates without a persistent connection. How it works and when to use it.
Chisato · · 5 min read A padding oracle attack exploits error messages during decryption to recover plaintext byte by byte, without ever breaking the cipher itself.
Takina · · 3 min read Reflow recalculates layout; repaint just redraws pixels. Why the difference matters for animation performance and how to avoid triggering reflow.
Takina · · 4 min read requestAnimationFrame schedules work right before the next repaint; requestIdleCallback runs only when the browser is otherwise idle. When to use each one.
Takina · · 4 min read Micro-frontends split one web app into independently deployable pieces owned by separate teams. How the pattern works, and its real tradeoffs.
Takina · · 4 min read The line-clamp property truncates text to a fixed number of lines and adds an ellipsis, without JavaScript or a fixed-height container.
Takina · · 4 min read Media queries respond to the viewport size; container queries respond to a component's own container. When to reach for each in a responsive layout.
Takina · · 3 min read CSS @scope limits selectors to a subtree of the DOM, giving native scoped styling without the specificity wars of global stylesheets.
Takina · · 4 min read ArrayBuffer allocates raw binary memory; typed arrays like Uint8Array give it a numeric type and view. How JavaScript handles binary data directly.
Takina · · 4 min read oklch(), hsl(), and rgb() define color differently in CSS. How each works, why oklch is perceptually uniform, and when to reach for which.
Takina · · 4 min read INP measures how long a page takes to visually respond to a click, tap, or keypress. What it counts, how it's scored, and how to bring it down.
Takina · · 4 min read CSS blend modes combine an element's colors with what's behind it, using mix-blend-mode and background-blend-mode instead of extra markup or canvas tricks.
Takina · · 5 min read The CSS writing-mode property switches text flow between horizontal and vertical, and it's the foundation logical properties like margin-inline build on.
Takina · · 4 min read tRPC lets TypeScript clients call server functions with full type inference and no schema or codegen step. How it works and where it fits.
Takina · · 5 min read Hoisting moves variable and function declarations to the top of their scope before code runs, which explains some of JavaScript's most confusing bugs.
Takina · · 3 min read CSS color-mix() blends two colors in a chosen color space right in a stylesheet, replacing the color math Sass and JavaScript used to handle.
Takina · · 4 min read The bfcache stores a full, running snapshot of a page in memory so back and forward navigation is instant instead of a fresh load. How it works.
Takina · · 4 min read Server Actions let Next.js run server-side functions directly from client components and forms, without hand-written API routes. How they work.
Takina · · 4 min read CSS :target styles the element whose ID matches the URL fragment, enabling tabs, modals, and highlights with zero JavaScript. How it works, with examples.
Takina · · 4 min read CSS transforms move, resize, and rotate elements without triggering layout. How translate, scale, rotate, and skew work, and why they're fast.
Takina · · 4 min read The URL API parses, builds, and validates URLs natively in JavaScript — no regex needed. How URL and URLSearchParams work, with practical examples.
Takina · · 4 min read The Clipboard API lets web pages read and write the system clipboard asynchronously, replacing the old execCommand copy/paste hacks with a real API.
Takina · · 4 min read The Web Share API lets a web page open the device's native share sheet to send text, links, or files to other apps, no clipboard hack required.
Takina · · 5 min read Virtual scrolling renders only the rows visible in the viewport, keeping the DOM small so lists with tens of thousands of items stay smooth.
Takina · · 4 min read Remix and Next.js both extend React with routing and data loading, but differ sharply in rendering model, data fetching, and deployment targets.
Takina · · 4 min read Playwright drives multiple browsers out-of-process via a devtools protocol; Cypress runs its test code inside the browser. How they differ in practice.
Takina · · 3 min read The Web Animations API lets JavaScript create and control animations natively, combining CSS-animation performance with imperative, scriptable control.
Takina · · 4 min read How flex-grow, flex-shrink, and flex-basis actually distribute space in a flex container, with the flex shorthand values worth memorizing.
Takina · · 4 min read The MutationObserver API watches for changes to the DOM — attributes, child nodes, and text — without polling. How it works and when to use it.
Chisato · · 5 min read A bug bounty program pays independent researchers for responsibly reporting security vulnerabilities before attackers find and exploit them.
Takina · · 3 min read SharedArrayBuffer lets JS threads share raw memory; Atomics provides race-free operations on it. How true multi-threaded data sharing works in JS.
Takina · · 4 min read Astro ships zero JS by default and hydrates only what needs it; Next.js is a full React application framework. How to pick between them.
Takina · · 4 min read A polyfill is code that implements a missing browser feature so older environments behave as if they supported it natively.
Takina · · 5 min read Branded types attach a compile-time-only tag to a primitive so TypeScript rejects mixing values that share a shape but not a meaning.
Takina · · 4 min read flat() flattens nested arrays by a given depth; flatMap() maps then flattens one level in a single pass. How each works and when to pick one.
Takina · · 4 min read The History API lets JavaScript change the URL and manage browser history without a page reload, which is what makes client-side routing possible.
Takina · · 4 min read Declaration merging lets TypeScript combine multiple declarations of the same name into one — the mechanism behind extending interfaces and global types.
Takina · · 4 min read The App Router uses React Server Components and nested layouts; the Pages Router is Next.js's original file-based model. How they differ and when to pick each.
Takina · · 3 min read The CSS gap property adds space between flex and grid items without margin hacks, and it works identically across both layout modes.
Chisato · · 4 min read Edge functions run application code on servers near the visitor instead of a single origin region, cutting latency for auth, redirects, and personalization.
Takina · · 4 min read CSS media queries apply styles conditionally based on viewport size, device features, and user preferences like color scheme or reduced motion.
Takina · · 4 min read Object.freeze() locks an object completely; Object.seal() only stops adding or removing properties. How the two immutability methods differ.
Takina · · 4 min read Abstract classes in TypeScript define shared implementation plus methods subclasses must fill in. How they differ from interfaces and when to reach for them.
Takina · · 4 min read The Page Visibility API tells JavaScript when a tab is hidden or visible, so you can pause polling, animations, and timers the user can't see.
Takina · · 4 min read The Beacon API lets a page send one last async request as it unloads, without blocking navigation or racing the browser's page teardown.
Takina · · 4 min read The CSS :not() selector excludes elements matching an argument list from a rule, letting you style everything except specific cases without extra classes.
Takina · · 4 min read A lockfile records the exact dependency versions your package manager resolved, so every install — from your laptop to CI — reproduces the same tree.
Takina · · 3 min read never represents values that can't exist — it marks unreachable code, exhaustive switches, and functions that always throw or loop forever.
Chisato · · 5 min read An IDS watches network traffic and alerts on threats; an IPS sits inline and blocks them automatically. How the two compare and when to use each.
Takina · · 4 min read TTFB measures the delay between a browser's request and the first byte of the response — a signal for server, network, and routing latency.
Takina · · 3 min read fetchpriority lets you tell the browser which resources matter most, overriding its default heuristics to load critical assets sooner.
Takina · · 4 min read TypeScript's readonly keyword blocks reassignment at compile time for properties, arrays, and tuples — with no runtime enforcement at all.
Takina · · 4 min read The Intl API formats dates, numbers, and currency using a user's locale without a library. How Intl.DateTimeFormat and Intl.NumberFormat work.
Takina · · 4 min read The prefers-reduced-motion media query detects a user's OS-level motion setting so CSS animations can be toned down or removed for people who need it.
Takina · · 4 min read A backend-for-frontend (BFF) is a dedicated backend layer for one client type — shaping, aggregating, and simplifying calls to shared downstream APIs.
Takina · · 4 min read requestIdleCallback runs low-priority JavaScript when the browser is idle, without blocking rendering, input, or the main thread.
Takina · · 5 min read Turbopack is a Rust-based bundler built for incremental speed; Webpack is the mature, plugin-heavy standard. How they differ and when to pick each.
Takina · · 4 min read HTTP range requests let a client ask for just part of a resource, enabling video seeking, resumable downloads, and partial file fetches over HTTP.
Takina · · 4 min read object-fit controls how an image or video is cropped inside its box, and object-position controls which part of it stays visible. How they work together.
Takina · · 5 min read CSS's four global keywords control where a property's value comes from. How inherit, initial, unset, and revert differ, with a comparison table.
Takina · · 5 min read Promise.all() fails fast, allSettled() waits for every result, and race() returns whichever promise finishes first — how to choose correctly.
Takina · · 4 min read JavaScript's dynamic import() loads a module on demand and returns a promise, letting you split bundles and defer code until it's actually needed.
Takina · · 4 min read The spread operator (...) expands an iterable into individual elements; the rest operator collects elements back into an array. Same syntax, opposite jobs.
Takina · · 4 min read dvh, svh, and lvh fix the classic mobile vh bug where browser toolbars cut off full-height layouts. Here's what each unit measures and when to use it.
Takina · · 4 min read TypeScript's as const assertion locks a value to its literal, readonly type instead of widening it. How it works and when to reach for it.
Chisato · · 5 min read Session fixation tricks a victim into using an attacker-known session ID, so logging in hands the attacker an authenticated session too.
Takina · · 4 min read The ResizeObserver API lets JavaScript watch an element's box size and react without polling or resize-event hacks. How it works and when to use it.
Chisato · · 4 min read IDOR is an access control flaw where an app trusts a user-supplied ID to fetch a record without checking the requester actually owns it.
The Lycoris Team · · 4 min read URI paths, custom headers, and content negotiation are the three common ways to version an API. Tradeoffs of each, and how to avoid breaking clients.
Takina · · 5 min read A JavaScript memory leak happens when a reference outlives its usefulness and the garbage collector can't reclaim it. Common causes and how to find them.
Takina · · 4 min read localStorage, sessionStorage, and cookies all store data in the browser, but differ in lifetime, size limits, and whether the server can see them.
Takina · · 4 min read repeat() and minmax() let CSS Grid build responsive layouts without media queries. How the two functions combine, and common patterns.
Chisato · · 4 min read Clickjacking tricks a user into clicking something they can't see, hidden inside an invisible iframe. How the attack works and how to stop it.
Chisato · · 4 min read Subresource Integrity lets a browser verify a fetched script or stylesheet matches an expected hash, blocking a tampered CDN asset from running.
Takina · · 4 min read Import maps let browsers resolve bare module specifiers like "react" to real URLs, enabling native ES module imports without a bundler.
Takina · · 5 min read The Push API lets a web app send notifications through a service worker, even when the site isn't open in a browser tab. Here's the full flow.
Takina · · 4 min read Z-index only compares elements within the same stacking context. What creates a new context, how they nest, and why z-index: 9999 sometimes fails.
Takina · · 5 min read Gzip and Brotli both shrink HTTP responses before they hit the wire. How each algorithm works, and why Brotli usually compresses text tighter.
Takina · · 5 min read How ::before and ::after generate content without extra markup, which properties they need, and common patterns like icons and counters.
Takina · · 5 min read JavaScript destructuring unpacks values from arrays and objects into variables in one expression. How it works, with the rest and spread operators.
Takina · · 4 min read How JavaScript determines what this refers to: default, implicit, explicit, and new binding, plus why arrow functions behave differently.
Chisato · · 4 min read DNS over HTTPS encrypts domain name lookups inside HTTPS traffic, hiding queries from network eavesdroppers. How DoH works and how it differs from DNSSEC.
Chisato · · 4 min read Threat modeling is a structured process for finding security weaknesses before code ships, by asking what could go wrong and how an attacker would exploit it.
Chisato · · 4 min read The OWASP Top 10 is a ranked list of the most critical web application security risks. What's on it, why it matters, and how teams use it.
Takina · · 5 min read Type guards are functions and checks that narrow a TypeScript union to a specific type at runtime. How typeof, instanceof, in, and custom guards work.
Takina · · 4 min read HTTP status codes are three-digit responses that tell a client what happened to its request. A practical tour of the codes that actually matter.
Takina · · 4 min read The Popover API gives HTML a built-in popover element with the popover attribute — top-layer rendering, light-dismiss, and no JavaScript required.
Takina · · 5 min read The CSS will-change property hints the browser to prepare an element for an upcoming change, moving it to its own compositor layer. When to use it and when not to.
Takina · · 4 min read TypeScript function overloads let one function name accept multiple call signatures with different types. How overload signatures work and when to use them.
Takina · · 4 min read CSS Houdini is a set of low-level browser APIs that let JavaScript hook into the CSS rendering pipeline itself, instead of working around it.
Takina · · 4 min read Tagged template literals let a function intercept a template string's parts before interpolation — the mechanism behind safe SQL, styled-components, and i18n.
Chisato · · 4 min read PKCE hardens the OAuth authorization code flow against interception, and is now recommended for every client type, not just mobile and single-page apps.
Takina · · 5 min read IndexedDB is a browser API for storing large amounts of structured data client-side, with indexes, transactions, and no size limit like localStorage.
Takina · · 4 min read Event delegation attaches one listener to a parent instead of one per child, using event bubbling to catch clicks from elements added after page load.
Takina · · 4 min read The native dialog element gives you modals and popovers with built-in focus trapping and accessibility, no JavaScript library required. Here's how it works.
Takina · · 3 min read The :nth-child() family selects elements by position among siblings, using a simple an+b formula. How it works and where it beats manually added classes.
Takina · · 4 min read The Intersection Observer API tells you when an element enters or leaves the viewport, without scroll-event polling. How it works and where to use it.
Chisato · · 4 min read HttpOnly, Secure, and SameSite are cookie attributes that block script access, force HTTPS, and limit cross-site sending. Here's what each one actually stops.
Takina · · 4 min read WebP, AVIF, and JPEG trade off compression, browser support, and encode speed differently. Which format to use where, and how to serve fallbacks safely.
Takina · · 4 min read structuredClone() is a built-in JavaScript function for deep-copying values, including cycles and typed arrays, without the workarounds JSON tricks require.
Takina · · 4 min read The CSS font-display property controls whether text waits for a web font or renders in a fallback first. Here's how swap, block, and optional differ.
Takina · · 4 min read HTTP/2 fixed request multiplexing but stayed on TCP; HTTP/3 moves to QUIC over UDP to kill head-of-line blocking at the transport layer. The real differences.
Takina · · 4 min read Responsive images use srcset and sizes to let the browser pick the right file for each screen, cutting wasted bytes without extra JavaScript.
Chisato · · 4 min read A timing attack infers secret data by measuring how long an operation takes to run. How timing side channels leak information and how to close them.
Takina · · 4 min read grid-template-areas lets you name grid regions and place items by name instead of row and column numbers, turning your CSS into a visual map of the layout.
Takina · · 4 min read Template literal types let TypeScript build string types from other types, like JavaScript template strings. How they work, with practical patterns.
Takina · · 4 min read CSS gradients render smooth color transitions directly in the browser — no image files. How linear, radial, and conic gradients work, with practical examples.
Takina · · 4 min read The Fetch API is JavaScript's built-in interface for making HTTP requests. How it works, its promise-based flow, and where it trips people up.
Takina · · 4 min read TypeScript's interface and type both describe object shapes, but they diverge on declaration merging, unions, and extension. When to reach for each.
Takina · · 4 min read content-visibility lets the browser skip layout, style, and paint for off-screen content, cutting rendering cost on long pages without JavaScript.
Takina · · 4 min read Solid.js uses fine-grained signals and no virtual DOM; React re-renders components and diffs. How the two reactivity models differ in practice.
Takina · · 5 min read SSE streams one-way updates over plain HTTP; WebSockets open a full-duplex channel. How they differ and which fits your real-time feature.
Takina · · 4 min read Mapped types transform one type into another by iterating over its keys — the mechanism behind Partial, Readonly, Record, and Pick under the hood.
Takina · · 4 min read backdrop-filter blurs, darkens, or otherwise adjusts whatever sits behind an element, powering frosted-glass UI without extra markup or JavaScript.
Takina · · 4 min read The Speculation Rules API lets browsers prerender pages before a click, making navigation feel instant. How it works and how it differs from prefetch.
Takina · · 4 min read TypeScript enums group named constants under one type. How numeric, string, and const enums compile, and when a union type is the better choice.
Takina · · 4 min read A JavaScript Symbol is a guaranteed-unique primitive used for collision-free object keys. How Symbols work, well-known Symbols, and when to use them.
Chisato · · 4 min read Certificate Transparency is a public, tamper-evident log of every TLS certificate issued, letting anyone detect mis-issued or rogue certificates.
Takina · · 4 min read CSS counters auto-number elements with counter-reset, counter-increment, and the counter() function — no JavaScript or manual list numbers required.
Chisato · · 5 min read RBAC grants access based on a user's assigned role; ABAC evaluates attributes of the user, resource, and context at request time. How they compare.
Takina · · 4 min read Progressive enhancement builds a working page with HTML first, then layers CSS and JavaScript on top — so a slow network or failed script never breaks the core experience.
Chisato · · 5 min read Certificate pinning hardcodes which certificate or public key an app should trust, blocking attacks that rely on a rogue but validly signed certificate.
Takina · · 4 min read A discriminated union tags each variant of a type with a shared literal field, letting TypeScript narrow the type automatically inside a switch or if check.
Takina · · 4 min read var, let, and const differ in scope, hoisting behavior, and reassignment rules. Here's what each one actually does and when to reach for it.
Takina · · 4 min read CSS env() reads values from the browser or device itself, like safe-area insets on notched phones, instead of from your own custom properties.
Takina · · 4 min read ESLint catches bugs and enforces code patterns; Prettier only reformats how code looks. Why most JavaScript projects run both, not one or the other.
Takina · · 4 min read Optional chaining (?.) short-circuits on null or undefined instead of throwing; nullish coalescing (??) supplies a default only for null or undefined.
Chisato · · 4 min read Encryption at rest protects stored data on disk; encryption in transit protects data moving over a network. Why production systems need both.
Chisato · · 4 min read gRPC uses binary Protocol Buffers over HTTP/2 for fast, typed service calls; REST uses JSON over HTTP for accessible, resource-based APIs. How to pick.
Takina · · 4 min read :focus-visible only shows a focus ring for keyboard and other non-pointer input, while :focus matches every focus event, including mouse clicks.
Takina · · 4 min read Prototypal inheritance means JavaScript objects inherit properties directly from other objects via a prototype chain, not from classes. How it works.
Chisato · · 4 min read The same-origin policy stops a script from one site reading data loaded from another. How origins are compared, and how CORS and cookies fit in.
Takina · · 4 min read Web workers run scripts off the main thread for parallel computation. Service workers intercept network requests for offline and caching. How they differ.
Chisato · · 4 min read A man-in-the-middle attack secretly intercepts traffic between two parties. How MITM attacks work, common variants, and the defenses that stop them.
Chisato · · 5 min read HSTS is a response header that tells browsers to only ever connect to a site over HTTPS, closing the gap that lets attackers strip encryption.
Takina · · 4 min read map, filter, and reduce transform arrays without loops or mutation. How each one works, when to reach for it, and where they trip people up.
Takina · · 4 min read TypeScript's unknown forces a type check before use; any opts out of type checking entirely. When to reach for each in real code.
Takina · · 4 min read A source map is a file that maps minified, bundled, or transpiled code back to its original source, so debuggers and stack traces stay readable.
Takina · · 4 min read CSS transitions animate a single state change; animations run independent, repeatable keyframe sequences. How to pick the right one for the job.
Takina · · 4 min read Conditional types let TypeScript pick a type based on another type, using T extends U ? X : Y — the foundation of most advanced type utilities.
Chisato · · 4 min read A VPN encrypts traffic between your device and a remote server, tunneling it through an untrusted network. How VPN tunneling and encryption work.
Takina · · 4 min read clip-path and mask-image clip or fade elements into custom shapes in pure CSS, replacing image editors and SVG sprites for cropping.
Takina · · 3 min read Currying transforms a multi-argument function into a chain of single-argument functions. How currying and partial application work in JavaScript.
Takina · · 3 min read Lazy loading defers offscreen images until they near the viewport. Comparing the native loading attribute against Intersection Observer-based approaches.
Chisato · · 4 min read Credential stuffing tests stolen username-password pairs against other sites, exploiting reused passwords. How it works and the defenses that actually stop it.
Takina · · 4 min read Vue uses a template syntax with a reactive proxy system; React uses JSX with a virtual DOM. How the two frameworks differ and when to pick each.
Chisato · · 4 min read The TLS handshake is how a browser and server agree on encryption and verify identity before any data is exchanged. Here's each step explained.
Takina · · 4 min read Node.js streams process data in chunks instead of loading it all into memory. How readable, writable, and transform streams work, and when to reach for them.
Takina · · 4 min read How to build dark mode in CSS with the prefers-color-scheme media query and the light-dark() color function, without duplicating your palette.
Takina · · 5 min read Cache-Control and ETag are the two headers that control HTTP caching — how long a response stays fresh and how to revalidate it cheaply, explained.
Takina · · 5 min read A WeakMap holds object keys without blocking garbage collection, unlike a regular Map. How WeakMap and WeakRef work and when to reach for them.
Takina · · 3 min read CSS scroll snap locks scrolling to fixed positions using scroll-snap-type and scroll-snap-align, no JavaScript required. Here's how it works.
Takina · · 4 min read JavaScript's Map and Set are built-in collections with cleaner semantics than plain objects and arrays. Here's how each works and when to reach for one.
Takina · · 4 min read The Temporal API is JavaScript's built-in replacement for Date — immutable, timezone-aware objects for dates, times, and durations.
Takina · · 4 min read Resource hints like preload, prefetch, and preconnect tell the browser what to fetch early. Here's how each one works and when to reach for it.
Takina · · 4 min read TypeScript's satisfies operator checks a value against a type without widening or erasing its inferred literal type. Here's when to reach for it.
Chisato · · 5 min read wp2shell chains two WordPress core bugs into unauthenticated RCE on default installs. What CVE-2026-60137 and CVE-2026-63030 do, who's affected, how to patch.
Chisato · · 5 min read SSO lets a user log in once with one identity provider and access multiple apps without re-entering credentials. How the trust relationship works.
Takina · · 4 min read CSS anchor positioning lets an element attach to another element's edges without JavaScript. How anchor(), position-anchor, and fallbacks work.
Takina · · 4 min read text-wrap: balance evens out line lengths in headlines using the browser's own layout engine, no JavaScript required. How it works and when to use it.
Takina · · 4 min read Astro's islands architecture ships static HTML by default and hydrates only the interactive components that need JavaScript. Here's how it works.
Takina · · 4 min read TypeScript decorators attach reusable behavior to classes and members with an @ syntax. How class, method, and field decorators work, with real examples.
Takina · · 4 min read @property registers a CSS custom property with a type, initial value, and inheritance rule — unlocking smooth animation and real error checking.
Chisato · · 4 min read SQL injection lets attackers run arbitrary database queries by smuggling SQL into user input. Parameterized queries close the hole. Here's how it works.
Takina · · 4 min read The CSS aspect-ratio property locks a box's width-to-height ratio in one line, replacing the old padding-top percentage trick. Syntax, gotchas, and use cases.
Takina · · 4 min read Shadow DOM attaches an isolated DOM tree to an element so a component's styles and markup can't leak in or out. Here's how it actually works.
Takina · · 4 min read npm, pnpm, and Yarn all install the same packages but differ in speed, disk usage, and monorepo support. Here's how to pick the right one.
Takina · · 4 min read AbortController lets JavaScript cancel an in-flight fetch or async task on demand, preventing stale responses from overwriting newer state.
Takina · · 5 min read ESM and CommonJS are JavaScript's two module systems — how import/export differs from require/module.exports, and when each one is used.
Chisato · · 3 min read Cross-site scripting (XSS) injects malicious scripts into pages other users view. How stored, reflected, and DOM-based XSS work, and how to prevent them.
Takina · · 4 min read Optimistic UI updates the interface immediately, before the server confirms a change, then rolls back if the request fails — for apps that feel instant.
Takina · · 4 min read CSS clamp() scales a value smoothly between a minimum and maximum, letting font sizes and spacing flex with the viewport without media queries.
Takina · · 4 min read Web Components are browser-native APIs for building reusable, encapsulated custom elements that work in any framework, or none at all.
Takina · · 4 min read TypeScript utility types like Partial, Pick, Omit, and Record transform existing types instead of redeclaring them. How the common ones work, with examples.
Chisato · · 4 min read Password hashing turns a password into a one-way, salted digest so a stolen database doesn't hand over credentials. How bcrypt and Argon2 work.
Takina · · 4 min read A monorepo holds multiple projects in one repository with shared tooling and atomic commits. How it compares to splitting projects across separate repos.
Takina · · 4 min read oklch(), lch(), and color-mix() let CSS describe color perceptually and blend it directly in the browser. How each works and when to reach for them.
Chisato · · 4 min read SSRF tricks a server into requesting unintended destinations, reaching internal systems attackers couldn't otherwise touch. How it works and how to stop it.
Chisato · · 4 min read A WAF is a filter sitting in front of a web app that inspects HTTP traffic for attack patterns like SQL injection and blocks malicious requests.
Takina · · 4 min read CSS scroll-driven animations tie keyframes to scroll position instead of a clock, running smoothly off the main thread. Here's how the timeline model works.
Takina · · 3 min read CSS subgrid lets a nested grid item inherit its parent's row and column tracks, so child elements line up across unrelated components.
Takina · · 4 min read SSR renders pages per request; SSG renders them at build time. How the tradeoff affects speed, freshness, and hosting cost — and how to pick.
Takina · · 4 min read Generators are functions that pause and resume with the yield keyword, producing values lazily on demand instead of computing them all at once.
Takina · · 4 min read The critical rendering path is the sequence a browser follows from HTML bytes to painted pixels — DOM, CSSOM, render tree, layout, paint.
Takina · · 4 min read px is a fixed unit, em scales to a parent's font size, and rem scales to the root. How to choose between them for sizing and typography in CSS.
The Lycoris Team · · 4 min read An idempotent operation produces the same result no matter how many times it runs. Why that matters for retries, payments, and reliable APIs.
Takina · · 4 min read REST exposes fixed endpoints per resource; GraphQL lets clients query exactly the fields they need through one endpoint. How to choose between them.
Takina · · 4 min read :is() and :where() group selector lists into one rule. Same matching logic, different specificity — here's when to reach for each.
Takina · · 4 min read A PWA is a website built to behave like a native app — installable, offline-capable, and fast — using standard web technologies, not app-store code.
Takina · · 4 min read TypeScript generics let functions and types work with any type while preserving the specific type used at each call site, avoiding both duplication and any.
Takina · · 4 min read CSS cascade layers let you group styles into named layers with explicit priority order, so specificity fights between resets, components, and overrides disappear.
The Lycoris Team · · 4 min read An ORM lets you query a database using your programming language's objects instead of raw SQL. How they work, what they trade off, and when to skip one.
Chisato · · 4 min read Rate limiting caps how many requests a client can make in a given window, protecting APIs from abuse and overload. Common algorithms compared.
Chisato · · 4 min read MFA requires two or more independent proofs of identity — something you know, have, or are — to stop stolen passwords from being enough to break in.
Takina · · 4 min read Async/await is syntactic sugar over Promises, not a different mechanism. How each looks in practice, and when to still reach for raw Promises.
Takina · · 4 min read The virtual DOM is an in-memory copy of the UI tree that frameworks diff against the previous version to batch and minimize real DOM updates.
Takina · · 4 min read :has() is CSS's relational pseudo-class — it lets a selector match an element based on what's inside or after it, finally enabling a parent selector.
Chisato · · 4 min read A Content Security Policy is an HTTP header that restricts what scripts and resources a page can load, blocking most XSS attacks by default.
Takina · · 4 min read A JavaScript Proxy wraps an object and intercepts operations like get and set through traps. How traps work, with practical examples and Reflect.
Takina · · 4 min read A web worker runs JavaScript on a background thread, freeing the main thread to keep the UI responsive. How workers communicate and when to use one.
Takina · · 4 min read Web accessibility (a11y) means building sites usable by people with disabilities. The core principles, semantic HTML, ARIA, and common patterns.
Chisato · · 4 min read CSRF tricks a logged-in user's browser into sending an unwanted authenticated request. Cookies, tokens, and SameSite settings are the defense.
Takina · · 5 min read Svelte compiles away at build time; React ships a runtime and virtual DOM. Bundle size, reactivity model, and ecosystem tradeoffs compared.
Takina · · 5 min read Native CSS nesting lets you nest selectors inside a parent rule without a preprocessor. How the syntax works, the & selector, and specificity gotchas.
Takina · · 4 min read CSS custom properties are native variables that cascade, inherit, and update live at runtime. How they work, why they beat preprocessor variables.
Takina · · 3 min read CSS logical properties like margin-inline and padding-block size and space elements relative to writing direction, not fixed physical sides.
Takina · · 5 min read Microsoft shipped TypeScript 7.0 with a Go-native compiler that's roughly 10x faster than 6.0. What changed, what breaks, and how to upgrade.
Takina · · 4 min read Tree shaking removes unused exports from a JavaScript bundle at build time, shrinking file size by relying on ES module static structure.
Takina · · 4 min read A service worker is a script that runs separately from your page, intercepting network requests to enable offline access, caching, and push notifications.
Takina · · 5 min read A JavaScript closure is a function that remembers the variables from where it was defined. How closures work, why they matter, and the classic loop gotcha.
Takina · · 5 min read CSS specificity is the scoring system that decides which rule wins when several target the same element. How the weights work and how to keep them low.
Takina · · 4 min read The CSS box model defines how every element is sized — content, padding, border, and margin. Here's how the layers stack and why box-sizing matters.
Chisato · · 6 min read Caching keeps a copy of expensive data somewhere faster. How cache-aside, write-through, and TTLs work — and why invalidation is the hard part.
Takina · · 3 min read htmx lets you build dynamic, interactive pages with HTML attributes — no SPA, no build step. Learn the core ideas and ship a working live-search example in minutes.
The Lycoris Team · · 5 min read JSON Schema is a vocabulary for describing and validating the shape of JSON data. How schemas work, where they show up, and the keywords that matter.
Takina · · 4 min read WebRTC lets browsers stream audio, video, and data directly between peers — no plugins. How getUserMedia, RTCPeerConnection, and ICE/STUN/TURN fit together.
The Lycoris Team · · 4 min read Monoliths ship faster early; microservices buy independent scaling and team autonomy at the cost of distributed complexity. How to choose.
Chisato · · 4 min read OAuth 2.0 handles authorization, OIDC adds authentication, and SAML powers enterprise SSO. How the three protocols differ and which one your app needs.
Takina · · 3 min read HTML is the standard markup language that structures every web page. Learn how elements, tags, and semantic HTML shape the web.
Takina · · 4 min read Container queries let components respond to the space they're given, not the viewport. Here's how they work and when to reach for them.
Chisato · · 5 min read The padlock in your address bar hides a clever handshake. Here's what actually happens when you load an HTTPS site — encryption, certificates, and trust.
Chisato · · 5 min read OAuth 2.0 grant types are the flows apps use to get access tokens. Authorization code with PKCE, client credentials, device flow — and when to use each.
The Lycoris Team · · 5 min read JSON and YAML represent the same data — the difference is syntax, strictness, and footguns. Where each format wins, and which to pick for configs and APIs.
Takina · · 4 min read Grid and Flexbox aren't rivals — they solve different problems. A simple rule of thumb, with examples, for choosing the right layout tool every time.
Takina · · 5 min read WebAssembly lets near-native code run in the browser and beyond. It's no longer experimental — here's where it's actually being used and why it matters.
Chisato · · 6 min read OAuth 2.0 lets apps access your data without your password. How the authorization flow works, what PKCE adds, and how OAuth differs from authentication.
Takina · · 4 min read A WebSocket is a protocol for full-duplex, persistent communication over a single TCP connection. Learn how it works, when to use it, and what the alternatives are.
Takina · · 3 min read GraphQL is a query language for APIs where clients request exactly the data they need. Learn how it works, when to use it, and how it compares to REST.
Takina · · 4 min read CORS lets a server opt in to cross-origin browser requests, relaxing the same-origin policy in a controlled way. Why it exists and how to fix CORS errors.
The Lycoris Team · · 5 min read A growing movement wants apps that work offline, sync seamlessly, and keep your data yours. Here's what 'local-first' means and why developers are excited.
Takina · · 4 min read JavaScript is single-threaded, yet pages stay responsive. A clear tour of the call stack, task queue, and microtasks — with examples you can run.
Takina · · 4 min read CSS is the language that styles every web page. Learn how selectors, the cascade, the box model, and modern layout tools like flexbox and grid work.
The Lycoris Team · · 3 min read An API is a defined contract that lets one piece of software talk to another. Learn what APIs are, how they work, and why modern software runs on them.
The Lycoris Team · · 6 min read JSON is a lightweight text format for structured data — the default for APIs and config files. Syntax, examples, common mistakes, and why it beat XML.
Takina · · 5 min read Signals offer fine-grained reactivity with automatic dependency tracking — and nearly every major framework has adopted them. Here's why the model won.
Takina · · 4 min read Tailwind v4 rewrites the engine from scratch for dramatically faster builds and moves configuration into CSS itself. Here's what changed and how to work with it.
Chisato · · 4 min read A JWT is a compact, signed token that carries JSON claims — identity and authorization without a session lookup. How it works and what to watch out for.
Takina · · 4 min read The View Transitions API brings smooth, app-like transitions to the web without a heavy SPA framework. Here's how it works and how to use it today.
Takina · · 4 min read Hydration is how JavaScript wakes up server-rendered HTML so static markup becomes interactive. The cost, the tradeoffs, and the modern alternatives.
Takina · · 5 min read An honest comparison of Bun and Node.js in 2026 — speed, ecosystem, built-in tooling, and when each runtime actually wins.
Takina · · 4 min read Astro 6 lands with a refined Content Layer, faster builds, and tighter defaults — what matters for content sites and how to upgrade calmly.
The Lycoris Team · · 3 min read A REST API is a web API that follows a set of conventions built on HTTP. Learn how URLs, HTTP methods, status codes, and JSON fit together.
Takina · · 4 min read HTTP/3 runs over QUIC instead of TCP, cutting head-of-line blocking and speeding up connections with built-in TLS 1.3. What changed and why it matters.
Takina · · 3 min read JavaScript is the programming language that makes web pages interactive. Learn how it works alongside HTML and CSS, and why it runs nearly everywhere.
Takina · · 5 min read React Server Components render exclusively on the server and stream a serialized result — no client JS shipped for that component. Here's what that actually means.
Takina · · 4 min read The DOM is the live in-memory tree browsers build from your HTML, which JavaScript reads and manipulates. Learn how it works and why it matters.
Takina · · 3 min read TypeScript adds a safety net to JavaScript without slowing you down. Here's how to set it up, the handful of concepts that matter, and how to adopt it gradually.
Takina · · 4 min read Vite serves source over native ES modules in development and bundles with Rollup for production. Why it replaced Webpack for most front-end projects.
Takina · · 5 min read Core Web Vitals affect both user experience and search ranking. Here's what LCP, INP, and CLS actually measure and the highest-impact ways to fix each one.
Takina · · 4 min read WebGPU is far more than a WebGL replacement. It exposes compute shaders, maps to modern GPU APIs, and enables in-browser ML inference.
Takina · · 4 min read A webhook is an HTTP callback that notifies your server the moment something happens — no polling. How webhooks work and how to use them safely.
Takina · · 4 min read Server-Sent Events stream real-time updates over a single HTTP connection. How SSE works, when to use it, and how it compares to WebSockets.
