[{"data":1,"prerenderedAt":1948},["ShallowReactive",2],{"blog-en-mastering-core-web-vitals-inp":3,"blog-related-en-mastering-core-web-vitals-inp":459},{"id":4,"title":5,"author":6,"body":7,"date":443,"description":444,"extension":445,"featured":446,"image":447,"meta":448,"navigation":208,"path":449,"readingTime":218,"seo":450,"slug":451,"stem":452,"tags":453,"__hash__":458},"blog\u002Fblog\u002Fen\u002Fmastering-core-web-vitals-inp.md","Mastering Core Web Vitals in 2026: Diagnosing and Fixing Interaction to Next Paint (INP)","Adam Abdel-Djamal",{"type":8,"value":9,"toc":433},"minimark",[10,19,26,33,36,41,44,47,69,71,75,78,123,125,129,138,141,356,358,362,369,420,422,426,429],[11,12,13,14,18],"p",{},"In March 2024, Google permanently retired First Input Delay (FID) and replaced it with ",[15,16,17],"strong",{},"Interaction to Next Paint (INP)"," as a Core Web Vital.",[11,20,21,22,25],{},"While FID only measured the delay of the very first click on a page, ",[15,23,24],{},"INP measures the responsiveness of EVERY single interaction"," throughout the user's entire visit (clicking a button, opening a drawer, expanding a dropdown, typing in a form).",[11,27,28,29,32],{},"If your INP exceeds ",[15,30,31],{},"200 milliseconds",", Google marks your site as \"Needs Improvement\" or \"Poor\", penalizing your organic search rankings. In this guide, we'll look at how to diagnose and fix INP issues in modern JavaScript applications.",[34,35],"hr",{},[37,38,40],"h2",{"id":39},"_1-the-anatomy-of-an-interaction","1. The Anatomy of an Interaction",[11,42,43],{},"When a user clicks an interactive element, the browser goes through three distinct phases:",[11,45,46],{},"$$\\text{INP Total Time} = \\text{Input Delay} + \\text{Processing Duration} + \\text{Presentation Delay}$$",[48,49,50,57,63],"ol",{},[51,52,53,56],"li",{},[15,54,55],{},"Input Delay",": The time between the user clicking and your event handler actually starting execution (caused by the main thread being busy with background tasks).",[51,58,59,62],{},[15,60,61],{},"Processing Duration",": The time spent executing your JavaScript event handler code.",[51,64,65,68],{},[15,66,67],{},"Presentation Delay",": The time the browser takes to recalculate styles, perform layout rendering, and paint the new frame onto the screen.",[34,70],{},[37,72,74],{"id":73},"_2-finding-long-tasks-in-chrome-devtools","2. Finding Long Tasks in Chrome DevTools",[11,76,77],{},"To track down what's blocking the main thread:",[48,79,80,87,94,107],{},[51,81,82,83,86],{},"Open Chrome DevTools -> ",[15,84,85],{},"Performance"," tab.",[51,88,89,90,93],{},"Click ",[15,91,92],{},"Record"," and interact with the sluggish UI element (e.g. clicking a filter button).",[51,95,96,97,100,101],{},"Look at the ",[15,98,99],{},"Interactions"," lane at the top:\n",[102,103,104],"ul",{},[51,105,106],{},"Yellow or red bars represent interactions taking >200ms.",[51,108,109,110,113,114],{},"Scroll down to the ",[15,111,112],{},"Main"," thread flame chart:\n",[102,115,116],{},[51,117,118,119,122],{},"Any task longer than 50ms is flagged with a red triangle as a ",[15,120,121],{},"Long Task",".",[34,124],{},[37,126,128],{"id":127},"_3-the-3-most-common-inp-fixes","3. The 3 Most Common INP Fixes",[130,131,133,134],"h3",{"id":132},"fix-1-yielding-to-the-main-thread-with-scheduleryield","Fix 1: Yielding to the Main Thread with ",[135,136,137],"code",{},"scheduler.yield()",[11,139,140],{},"If your click handler performs heavy work (like client-side sorting of 5,000 items), split the task and yield control back to the browser so it can render a loading state:",[142,143,148],"pre",{"className":144,"code":145,"language":146,"meta":147,"style":147},"language-typescript shiki shiki-themes github-light github-dark","async function handleFilterClick(category: string) {\n  \u002F\u002F 1. Immediately update visual feedback (e.g. active tab style)\n  activeCategory.value = category\n\n  \u002F\u002F 2. Yield control to let the browser paint the active tab immediately!\n  if ('scheduler' in window && 'yield' in (window as any).scheduler) {\n    await (window as any).scheduler.yield()\n  } else {\n    await new Promise(resolve => setTimeout(resolve, 0))\n  }\n\n  \u002F\u002F 3. Perform the heavy list computation\n  filteredItems.value = expensiveFilter(allItems.value, category)\n}\n","typescript","",[135,149,150,184,191,203,210,216,255,276,288,319,325,330,336,350],{"__ignoreMap":147},[151,152,155,159,162,166,170,174,177,181],"span",{"class":153,"line":154},"line",1,[151,156,158],{"class":157},"szBVR","async",[151,160,161],{"class":157}," function",[151,163,165],{"class":164},"sScJk"," handleFilterClick",[151,167,169],{"class":168},"sVt8B","(",[151,171,173],{"class":172},"s4XuR","category",[151,175,176],{"class":157},":",[151,178,180],{"class":179},"sj4cs"," string",[151,182,183],{"class":168},") {\n",[151,185,187],{"class":153,"line":186},2,[151,188,190],{"class":189},"sJ8bj","  \u002F\u002F 1. Immediately update visual feedback (e.g. active tab style)\n",[151,192,194,197,200],{"class":153,"line":193},3,[151,195,196],{"class":168},"  activeCategory.value ",[151,198,199],{"class":157},"=",[151,201,202],{"class":168}," category\n",[151,204,206],{"class":153,"line":205},4,[151,207,209],{"emptyLinePlaceholder":208},true,"\n",[151,211,213],{"class":153,"line":212},5,[151,214,215],{"class":189},"  \u002F\u002F 2. Yield control to let the browser paint the active tab immediately!\n",[151,217,219,222,225,229,232,235,238,241,243,246,249,252],{"class":153,"line":218},6,[151,220,221],{"class":157},"  if",[151,223,224],{"class":168}," (",[151,226,228],{"class":227},"sZZnC","'scheduler'",[151,230,231],{"class":157}," in",[151,233,234],{"class":168}," window ",[151,236,237],{"class":157},"&&",[151,239,240],{"class":227}," 'yield'",[151,242,231],{"class":157},[151,244,245],{"class":168}," (window ",[151,247,248],{"class":157},"as",[151,250,251],{"class":179}," any",[151,253,254],{"class":168},").scheduler) {\n",[151,256,258,261,263,265,267,270,273],{"class":153,"line":257},7,[151,259,260],{"class":157},"    await",[151,262,245],{"class":168},[151,264,248],{"class":157},[151,266,251],{"class":179},[151,268,269],{"class":168},").scheduler.",[151,271,272],{"class":164},"yield",[151,274,275],{"class":168},"()\n",[151,277,279,282,285],{"class":153,"line":278},8,[151,280,281],{"class":168},"  } ",[151,283,284],{"class":157},"else",[151,286,287],{"class":168}," {\n",[151,289,291,293,296,299,301,304,307,310,313,316],{"class":153,"line":290},9,[151,292,260],{"class":157},[151,294,295],{"class":157}," new",[151,297,298],{"class":179}," Promise",[151,300,169],{"class":168},[151,302,303],{"class":172},"resolve",[151,305,306],{"class":157}," =>",[151,308,309],{"class":164}," setTimeout",[151,311,312],{"class":168},"(resolve, ",[151,314,315],{"class":179},"0",[151,317,318],{"class":168},"))\n",[151,320,322],{"class":153,"line":321},10,[151,323,324],{"class":168},"  }\n",[151,326,328],{"class":153,"line":327},11,[151,329,209],{"emptyLinePlaceholder":208},[151,331,333],{"class":153,"line":332},12,[151,334,335],{"class":189},"  \u002F\u002F 3. Perform the heavy list computation\n",[151,337,339,342,344,347],{"class":153,"line":338},13,[151,340,341],{"class":168},"  filteredItems.value ",[151,343,199],{"class":157},[151,345,346],{"class":164}," expensiveFilter",[151,348,349],{"class":168},"(allItems.value, category)\n",[151,351,353],{"class":153,"line":352},14,[151,354,355],{"class":168},"}\n",[34,357],{},[130,359,361],{"id":360},"fix-2-avoiding-forced-synchronous-layouts-layout-thrashing","Fix 2: Avoiding Forced Synchronous Layouts (Layout Thrashing)",[11,363,364,365,368],{},"Reading layout geometry (e.g., ",[135,366,367],{},"element.offsetHeight",") immediately after writing styles causes the browser to forcefully recalculate the entire page layout mid-script:",[142,370,374],{"className":371,"code":372,"language":373,"meta":147,"style":147},"language-javascript shiki shiki-themes github-light github-dark","\u002F\u002F ❌ Layout Thrashing (INP Nightmare)\nboxes.forEach(box => {\n  box.style.width = '200px' \u002F\u002F Write\n  const height = box.offsetHeight \u002F\u002F Read forces immediate synchronous layout!\n})\n\n\u002F\u002F ✅ Batch reads first, then writes\nconst heights = boxes.map(box => box.offsetHeight) \u002F\u002F Batch reads\nboxes.forEach(box => { box.style.width = '200px' }) \u002F\u002F Batch writes\n","javascript",[135,375,376,381,386,391,396,401,405,410,415],{"__ignoreMap":147},[151,377,378],{"class":153,"line":154},[151,379,380],{},"\u002F\u002F ❌ Layout Thrashing (INP Nightmare)\n",[151,382,383],{"class":153,"line":186},[151,384,385],{},"boxes.forEach(box => {\n",[151,387,388],{"class":153,"line":193},[151,389,390],{},"  box.style.width = '200px' \u002F\u002F Write\n",[151,392,393],{"class":153,"line":205},[151,394,395],{},"  const height = box.offsetHeight \u002F\u002F Read forces immediate synchronous layout!\n",[151,397,398],{"class":153,"line":212},[151,399,400],{},"})\n",[151,402,403],{"class":153,"line":218},[151,404,209],{"emptyLinePlaceholder":208},[151,406,407],{"class":153,"line":257},[151,408,409],{},"\u002F\u002F ✅ Batch reads first, then writes\n",[151,411,412],{"class":153,"line":278},[151,413,414],{},"const heights = boxes.map(box => box.offsetHeight) \u002F\u002F Batch reads\n",[151,416,417],{"class":153,"line":290},[151,418,419],{},"boxes.forEach(box => { box.style.width = '200px' }) \u002F\u002F Batch writes\n",[34,421],{},[130,423,425],{"id":424},"fix-3-offloading-heavy-computation-to-web-workers","Fix 3: Offloading Heavy Computation to Web Workers",[11,427,428],{},"For intensive tasks like CSV parsing, image resizing, or crypto calculations, offload them completely off the main thread into a Web Worker using libraries like Comlink. The UI stays 100% responsive at 60 FPS regardless of CPU load.",[430,431,432],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":147,"searchDepth":186,"depth":186,"links":434},[435,436,437],{"id":39,"depth":186,"text":40},{"id":73,"depth":186,"text":74},{"id":127,"depth":186,"text":128,"children":438},[439,441,442],{"id":132,"depth":193,"text":440},"Fix 1: Yielding to the Main Thread with scheduler.yield()",{"id":360,"depth":193,"text":361},{"id":424,"depth":193,"text":425},"2026-09-05","INP officially replaced FID as Google's responsiveness metric. Explaining how to profile Long Tasks in Chrome DevTools and keep UI clicks feeling instant.","md",false,null,{},"\u002Fblog\u002Fen\u002Fmastering-core-web-vitals-inp",{"title":5,"description":444},"mastering-core-web-vitals-inp","blog\u002Fen\u002Fmastering-core-web-vitals-inp",[454,455,373,456,457],"performance","seo","vue","frontend","-S10G64zmDsIZrWQwMpT8ym_BYzKKst2K_nUFz-KpOg",[460,1297],{"id":461,"title":462,"author":6,"body":463,"date":1285,"description":1286,"extension":445,"featured":446,"image":447,"meta":1287,"navigation":208,"path":1288,"readingTime":218,"seo":1289,"slug":447,"stem":1290,"tags":1291,"__hash__":1296},"blog\u002Fblog\u002Fen\u002Fapi-common-mistakes.md","6 Common API Mistakes (And How to Fix Them)",{"type":8,"value":464,"toc":1276},[465,468,470,474,485,516,537,539,543,550,633,638,758,760,764,767,827,830,832,836,839,974,981,983,987,990,1168,1171,1173,1177,1180,1214,1221,1223,1227,1230,1273],[11,466,467],{},"Building an API feels straightforward until your first production incident. Most bugs aren't complex — they're the same six mistakes repeated across thousands of codebases. Here's what they are and how to stop making them.",[34,469],{},[37,471,473],{"id":472},"_1-using-the-wrong-http-method","1. Using the Wrong HTTP Method",[11,475,476,477,480,481,484],{},"The most visible mistake. Using ",[135,478,479],{},"GET"," to delete a resource, or ",[135,482,483],{},"POST"," for everything because \"it works.\"",[142,486,490],{"className":487,"code":488,"language":489,"meta":147,"style":147},"language-http shiki shiki-themes github-light github-dark","# ❌ Deleting with GET — catastrophic if a browser prefetches this URL\nGET \u002Fapi\u002Fusers\u002F42\u002Fdelete\n\n# ✅ Correct\nDELETE \u002Fapi\u002Fusers\u002F42\n","http",[135,491,492,497,502,506,511],{"__ignoreMap":147},[151,493,494],{"class":153,"line":154},[151,495,496],{},"# ❌ Deleting with GET — catastrophic if a browser prefetches this URL\n",[151,498,499],{"class":153,"line":186},[151,500,501],{},"GET \u002Fapi\u002Fusers\u002F42\u002Fdelete\n",[151,503,504],{"class":153,"line":193},[151,505,209],{"emptyLinePlaceholder":208},[151,507,508],{"class":153,"line":205},[151,509,510],{},"# ✅ Correct\n",[151,512,513],{"class":153,"line":212},[151,514,515],{},"DELETE \u002Fapi\u002Fusers\u002F42\n",[11,517,518,519,521,522,524,525,528,529,532,533,536],{},"HTTP methods carry semantic meaning that clients, proxies, and caches rely on. ",[135,520,479],{}," must be idempotent and safe (no side effects). ",[135,523,483],{}," creates. ",[135,526,527],{},"PUT","\u002F",[135,530,531],{},"PATCH"," update. ",[135,534,535],{},"DELETE"," removes. Violating these conventions breaks caching, browser history, and every HTTP client that follows the spec.",[34,538],{},[37,540,542],{"id":541},"_2-wrong-status-codes","2. Wrong Status Codes",[11,544,545,546,549],{},"Returning ",[135,547,548],{},"200 OK"," for an error response is the most common mistake in junior APIs.",[142,551,555],{"className":552,"code":553,"language":554,"meta":147,"style":147},"language-json shiki shiki-themes github-light github-dark","\u002F\u002F ❌ Status 200, but it's an error\n{\n  \"success\": false,\n  \"error\": \"User not found\"\n}\n\n\u002F\u002F ✅ Status 404 — the client knows immediately without parsing the body\n{\n  \"error\": \"User not found\",\n  \"code\": \"USER_NOT_FOUND\"\n}\n","json",[135,556,557,562,567,581,591,595,599,604,608,619,629],{"__ignoreMap":147},[151,558,559],{"class":153,"line":154},[151,560,561],{"class":189},"\u002F\u002F ❌ Status 200, but it's an error\n",[151,563,564],{"class":153,"line":186},[151,565,566],{"class":168},"{\n",[151,568,569,572,575,578],{"class":153,"line":193},[151,570,571],{"class":179},"  \"success\"",[151,573,574],{"class":168},": ",[151,576,577],{"class":179},"false",[151,579,580],{"class":168},",\n",[151,582,583,586,588],{"class":153,"line":205},[151,584,585],{"class":179},"  \"error\"",[151,587,574],{"class":168},[151,589,590],{"class":227},"\"User not found\"\n",[151,592,593],{"class":153,"line":212},[151,594,355],{"class":168},[151,596,597],{"class":153,"line":218},[151,598,209],{"emptyLinePlaceholder":208},[151,600,601],{"class":153,"line":257},[151,602,603],{"class":189},"\u002F\u002F ✅ Status 404 — the client knows immediately without parsing the body\n",[151,605,606],{"class":153,"line":278},[151,607,566],{"class":168},[151,609,610,612,614,617],{"class":153,"line":290},[151,611,585],{"class":179},[151,613,574],{"class":168},[151,615,616],{"class":227},"\"User not found\"",[151,618,580],{"class":168},[151,620,621,624,626],{"class":153,"line":321},[151,622,623],{"class":179},"  \"code\"",[151,625,574],{"class":168},[151,627,628],{"class":227},"\"USER_NOT_FOUND\"\n",[151,630,631],{"class":153,"line":327},[151,632,355],{"class":168},[11,634,635],{},[15,636,637],{},"The codes that matter most:",[639,640,641,654],"table",{},[642,643,644],"thead",{},[645,646,647,651],"tr",{},[648,649,650],"th",{},"Code",[648,652,653],{},"When to use it",[655,656,657,668,678,688,698,708,718,728,738,748],"tbody",{},[645,658,659,665],{},[660,661,662],"td",{},[135,663,664],{},"200",[660,666,667],{},"Success with a body",[645,669,670,675],{},[660,671,672],{},[135,673,674],{},"201",[660,676,677],{},"Resource created (POST)",[645,679,680,685],{},[660,681,682],{},[135,683,684],{},"204",[660,686,687],{},"Success, no body (DELETE)",[645,689,690,695],{},[660,691,692],{},[135,693,694],{},"400",[660,696,697],{},"Invalid input from the client",[645,699,700,705],{},[660,701,702],{},[135,703,704],{},"401",[660,706,707],{},"Not authenticated",[645,709,710,715],{},[660,711,712],{},[135,713,714],{},"403",[660,716,717],{},"Authenticated but not authorized",[645,719,720,725],{},[660,721,722],{},[135,723,724],{},"404",[660,726,727],{},"Resource doesn't exist",[645,729,730,735],{},[660,731,732],{},[135,733,734],{},"422",[660,736,737],{},"Input syntactically valid but semantically wrong",[645,739,740,745],{},[660,741,742],{},[135,743,744],{},"429",[660,746,747],{},"Rate limit exceeded",[645,749,750,755],{},[660,751,752],{},[135,753,754],{},"500",[660,756,757],{},"Server error (never the client's fault)",[34,759],{},[37,761,763],{"id":762},"_3-trusting-client-input","3. Trusting Client Input",[11,765,766],{},"Every value sent by a client is a potential attack vector.",[142,768,772],{"className":769,"code":770,"language":771,"meta":147,"style":147},"language-php shiki shiki-themes github-light github-dark","\u002F\u002F ❌ Never do this\n$id = $_GET['id'];\n$query = \"SELECT * FROM users WHERE id = $id\";\n\u002F\u002F SQL injection: ?id=1 OR 1=1\n\n\u002F\u002F ✅ Always validate and sanitize\n$id = filter_var($_GET['id'], FILTER_VALIDATE_INT);\nif (!$id) {\n    return response()->json(['error' => 'Invalid ID'], 400);\n}\n$user = User::findOrFail($id); \u002F\u002F parameterized query\n","php",[135,773,774,779,784,789,794,798,803,808,813,818,822],{"__ignoreMap":147},[151,775,776],{"class":153,"line":154},[151,777,778],{},"\u002F\u002F ❌ Never do this\n",[151,780,781],{"class":153,"line":186},[151,782,783],{},"$id = $_GET['id'];\n",[151,785,786],{"class":153,"line":193},[151,787,788],{},"$query = \"SELECT * FROM users WHERE id = $id\";\n",[151,790,791],{"class":153,"line":205},[151,792,793],{},"\u002F\u002F SQL injection: ?id=1 OR 1=1\n",[151,795,796],{"class":153,"line":212},[151,797,209],{"emptyLinePlaceholder":208},[151,799,800],{"class":153,"line":218},[151,801,802],{},"\u002F\u002F ✅ Always validate and sanitize\n",[151,804,805],{"class":153,"line":257},[151,806,807],{},"$id = filter_var($_GET['id'], FILTER_VALIDATE_INT);\n",[151,809,810],{"class":153,"line":278},[151,811,812],{},"if (!$id) {\n",[151,814,815],{"class":153,"line":290},[151,816,817],{},"    return response()->json(['error' => 'Invalid ID'], 400);\n",[151,819,820],{"class":153,"line":321},[151,821,355],{},[151,823,824],{"class":153,"line":327},[151,825,826],{},"$user = User::findOrFail($id); \u002F\u002F parameterized query\n",[11,828,829],{},"Validate: type, format, length, range. Sanitize before any database or filesystem operation. Never trust what arrives in the request body, headers, or query string.",[34,831],{},[37,833,835],{"id":834},"_4-leaking-sensitive-data","4. Leaking Sensitive Data",[11,837,838],{},"Returning the full database object without filtering is an invitation to a data breach.",[142,840,842],{"className":552,"code":841,"language":554,"meta":147,"style":147},"\u002F\u002F ❌ Returning the raw User model\n{\n  \"id\": 42,\n  \"email\": \"user@example.com\",\n  \"password\": \"$2b$12$...\",\n  \"stripe_customer_id\": \"cus_xxx\",\n  \"internal_notes\": \"flagged for review\",\n  \"created_at\": \"2024-01-01\"\n}\n\n\u002F\u002F ✅ Return only what the client actually needs\n{\n  \"id\": 42,\n  \"email\": \"user@example.com\",\n  \"created_at\": \"2024-01-01\"\n}\n",[135,843,844,849,853,865,877,889,901,913,923,927,931,936,940,950,960,969],{"__ignoreMap":147},[151,845,846],{"class":153,"line":154},[151,847,848],{"class":189},"\u002F\u002F ❌ Returning the raw User model\n",[151,850,851],{"class":153,"line":186},[151,852,566],{"class":168},[151,854,855,858,860,863],{"class":153,"line":193},[151,856,857],{"class":179},"  \"id\"",[151,859,574],{"class":168},[151,861,862],{"class":179},"42",[151,864,580],{"class":168},[151,866,867,870,872,875],{"class":153,"line":205},[151,868,869],{"class":179},"  \"email\"",[151,871,574],{"class":168},[151,873,874],{"class":227},"\"user@example.com\"",[151,876,580],{"class":168},[151,878,879,882,884,887],{"class":153,"line":212},[151,880,881],{"class":179},"  \"password\"",[151,883,574],{"class":168},[151,885,886],{"class":227},"\"$2b$12$...\"",[151,888,580],{"class":168},[151,890,891,894,896,899],{"class":153,"line":218},[151,892,893],{"class":179},"  \"stripe_customer_id\"",[151,895,574],{"class":168},[151,897,898],{"class":227},"\"cus_xxx\"",[151,900,580],{"class":168},[151,902,903,906,908,911],{"class":153,"line":257},[151,904,905],{"class":179},"  \"internal_notes\"",[151,907,574],{"class":168},[151,909,910],{"class":227},"\"flagged for review\"",[151,912,580],{"class":168},[151,914,915,918,920],{"class":153,"line":278},[151,916,917],{"class":179},"  \"created_at\"",[151,919,574],{"class":168},[151,921,922],{"class":227},"\"2024-01-01\"\n",[151,924,925],{"class":153,"line":290},[151,926,355],{"class":168},[151,928,929],{"class":153,"line":321},[151,930,209],{"emptyLinePlaceholder":208},[151,932,933],{"class":153,"line":327},[151,934,935],{"class":189},"\u002F\u002F ✅ Return only what the client actually needs\n",[151,937,938],{"class":153,"line":332},[151,939,566],{"class":168},[151,941,942,944,946,948],{"class":153,"line":338},[151,943,857],{"class":179},[151,945,574],{"class":168},[151,947,862],{"class":179},[151,949,580],{"class":168},[151,951,952,954,956,958],{"class":153,"line":352},[151,953,869],{"class":179},[151,955,574],{"class":168},[151,957,874],{"class":227},[151,959,580],{"class":168},[151,961,963,965,967],{"class":153,"line":962},15,[151,964,917],{"class":179},[151,966,574],{"class":168},[151,968,922],{"class":227},[151,970,972],{"class":153,"line":971},16,[151,973,355],{"class":168},[11,975,976,977,980],{},"Use serializers, DTOs, or API Resources (Laravel) to explicitly define what gets exposed. The rule: ",[15,978,979],{},"opt-in, not opt-out."," Start with nothing, add what's needed.",[34,982],{},[37,984,986],{"id":985},"_5-inconsistent-error-format","5. Inconsistent Error Format",[11,988,989],{},"When every endpoint returns errors differently, every client has to handle every format.",[142,991,993],{"className":552,"code":992,"language":554,"meta":147,"style":147},"\u002F\u002F ❌ Endpoint A\n{ \"message\": \"Not found\" }\n\n\u002F\u002F ❌ Endpoint B\n{ \"error\": true, \"msg\": \"Validation failed\", \"fields\": [\"email\"] }\n\n\u002F\u002F ❌ Endpoint C\n\"Internal server error\"\n\n\u002F\u002F ✅ One format, everywhere\n{\n  \"error\": {\n    \"code\": \"VALIDATION_FAILED\",\n    \"message\": \"The request contains invalid fields.\",\n    \"details\": [\n      { \"field\": \"email\", \"issue\": \"Invalid email format\" }\n    ]\n  }\n}\n",[135,994,995,1000,1016,1020,1025,1062,1066,1071,1076,1080,1085,1089,1096,1108,1120,1128,1152,1158,1163],{"__ignoreMap":147},[151,996,997],{"class":153,"line":154},[151,998,999],{"class":189},"\u002F\u002F ❌ Endpoint A\n",[151,1001,1002,1005,1008,1010,1013],{"class":153,"line":186},[151,1003,1004],{"class":168},"{ ",[151,1006,1007],{"class":179},"\"message\"",[151,1009,574],{"class":168},[151,1011,1012],{"class":227},"\"Not found\"",[151,1014,1015],{"class":168}," }\n",[151,1017,1018],{"class":153,"line":193},[151,1019,209],{"emptyLinePlaceholder":208},[151,1021,1022],{"class":153,"line":205},[151,1023,1024],{"class":189},"\u002F\u002F ❌ Endpoint B\n",[151,1026,1027,1029,1032,1034,1037,1040,1043,1045,1048,1050,1053,1056,1059],{"class":153,"line":212},[151,1028,1004],{"class":168},[151,1030,1031],{"class":179},"\"error\"",[151,1033,574],{"class":168},[151,1035,1036],{"class":179},"true",[151,1038,1039],{"class":168},", ",[151,1041,1042],{"class":179},"\"msg\"",[151,1044,574],{"class":168},[151,1046,1047],{"class":227},"\"Validation failed\"",[151,1049,1039],{"class":168},[151,1051,1052],{"class":179},"\"fields\"",[151,1054,1055],{"class":168},": [",[151,1057,1058],{"class":227},"\"email\"",[151,1060,1061],{"class":168},"] }\n",[151,1063,1064],{"class":153,"line":218},[151,1065,209],{"emptyLinePlaceholder":208},[151,1067,1068],{"class":153,"line":257},[151,1069,1070],{"class":189},"\u002F\u002F ❌ Endpoint C\n",[151,1072,1073],{"class":153,"line":278},[151,1074,1075],{"class":227},"\"Internal server error\"\n",[151,1077,1078],{"class":153,"line":290},[151,1079,209],{"emptyLinePlaceholder":208},[151,1081,1082],{"class":153,"line":321},[151,1083,1084],{"class":189},"\u002F\u002F ✅ One format, everywhere\n",[151,1086,1087],{"class":153,"line":327},[151,1088,566],{"class":168},[151,1090,1091,1093],{"class":153,"line":332},[151,1092,585],{"class":179},[151,1094,1095],{"class":168},": {\n",[151,1097,1098,1101,1103,1106],{"class":153,"line":338},[151,1099,1100],{"class":179},"    \"code\"",[151,1102,574],{"class":168},[151,1104,1105],{"class":227},"\"VALIDATION_FAILED\"",[151,1107,580],{"class":168},[151,1109,1110,1113,1115,1118],{"class":153,"line":352},[151,1111,1112],{"class":179},"    \"message\"",[151,1114,574],{"class":168},[151,1116,1117],{"class":227},"\"The request contains invalid fields.\"",[151,1119,580],{"class":168},[151,1121,1122,1125],{"class":153,"line":962},[151,1123,1124],{"class":179},"    \"details\"",[151,1126,1127],{"class":168},": [\n",[151,1129,1130,1133,1136,1138,1140,1142,1145,1147,1150],{"class":153,"line":971},[151,1131,1132],{"class":168},"      { ",[151,1134,1135],{"class":179},"\"field\"",[151,1137,574],{"class":168},[151,1139,1058],{"class":227},[151,1141,1039],{"class":168},[151,1143,1144],{"class":179},"\"issue\"",[151,1146,574],{"class":168},[151,1148,1149],{"class":227},"\"Invalid email format\"",[151,1151,1015],{"class":168},[151,1153,1155],{"class":153,"line":1154},17,[151,1156,1157],{"class":168},"    ]\n",[151,1159,1161],{"class":153,"line":1160},18,[151,1162,324],{"class":168},[151,1164,1166],{"class":153,"line":1165},19,[151,1167,355],{"class":168},[11,1169,1170],{},"Define your error envelope once. Apply it everywhere via a global exception handler. Clients — including your own frontend — will thank you.",[34,1172],{},[37,1174,1176],{"id":1175},"_6-no-api-versioning","6. No API Versioning",[11,1178,1179],{},"Changing an endpoint response breaks every client using it. Without versioning, you can never evolve the API.",[142,1181,1183],{"className":487,"code":1182,"language":489,"meta":147,"style":147},"# ❌ No version — any breaking change affects all clients immediately\nGET \u002Fapi\u002Fusers\n\n# ✅ Versioned — v1 stays stable, v2 introduces breaking changes safely\nGET \u002Fapi\u002Fv1\u002Fusers\nGET \u002Fapi\u002Fv2\u002Fusers\n",[135,1184,1185,1190,1195,1199,1204,1209],{"__ignoreMap":147},[151,1186,1187],{"class":153,"line":154},[151,1188,1189],{},"# ❌ No version — any breaking change affects all clients immediately\n",[151,1191,1192],{"class":153,"line":186},[151,1193,1194],{},"GET \u002Fapi\u002Fusers\n",[151,1196,1197],{"class":153,"line":193},[151,1198,209],{"emptyLinePlaceholder":208},[151,1200,1201],{"class":153,"line":205},[151,1202,1203],{},"# ✅ Versioned — v1 stays stable, v2 introduces breaking changes safely\n",[151,1205,1206],{"class":153,"line":212},[151,1207,1208],{},"GET \u002Fapi\u002Fv1\u002Fusers\n",[151,1210,1211],{"class":153,"line":218},[151,1212,1213],{},"GET \u002Fapi\u002Fv2\u002Fusers\n",[11,1215,1216,1217,1220],{},"Version from day one, even if you only have v1. The cost of adding ",[135,1218,1219],{},"\u002Fv1\u002F"," later — after clients are in production — is much higher than the cost of including it from the start.",[34,1222],{},[37,1224,1226],{"id":1225},"the-takeaway","The Takeaway",[11,1228,1229],{},"None of these mistakes require advanced knowledge to fix. They require discipline: a checklist before every endpoint ships.",[102,1231,1234,1243,1249,1255,1261,1267],{"className":1232},[1233],"contains-task-list",[51,1235,1238,1242],{"className":1236},[1237],"task-list-item",[1239,1240],"input",{"disabled":208,"type":1241},"checkbox"," HTTP method matches the operation's semantics",[51,1244,1246,1248],{"className":1245},[1237],[1239,1247],{"disabled":208,"type":1241}," Status code is accurate",[51,1250,1252,1254],{"className":1251},[1237],[1239,1253],{"disabled":208,"type":1241}," All input is validated before use",[51,1256,1258,1260],{"className":1257},[1237],[1239,1259],{"disabled":208,"type":1241}," Response only exposes necessary fields",[51,1262,1264,1266],{"className":1263},[1237],[1239,1265],{"disabled":208,"type":1241}," Errors follow the global format",[51,1268,1270,1272],{"className":1269},[1237],[1239,1271],{"disabled":208,"type":1241}," URL includes an API version",[430,1274,1275],{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}",{"title":147,"searchDepth":186,"depth":186,"links":1277},[1278,1279,1280,1281,1282,1283,1284],{"id":472,"depth":186,"text":473},{"id":541,"depth":186,"text":542},{"id":762,"depth":186,"text":763},{"id":834,"depth":186,"text":835},{"id":985,"depth":186,"text":986},{"id":1175,"depth":186,"text":1176},{"id":1225,"depth":186,"text":1226},"2026-06-04","From wrong HTTP methods to leaking sensitive data — the errors most developers make when building their first API, and the concrete fixes.",{},"\u002Fblog\u002Fen\u002Fapi-common-mistakes",{"title":462,"description":1286},"blog\u002Fen\u002Fapi-common-mistakes",[1292,1293,1294,1295],"api","backend","rest","best-practices","z2NMprz3c9WpXKotgDMzEF9WM_LLLolyFqidBZu4I6s",{"id":1298,"title":1299,"author":6,"body":1300,"date":1937,"description":1938,"extension":445,"featured":446,"image":447,"meta":1939,"navigation":208,"path":1940,"readingTime":218,"seo":1941,"slug":1942,"stem":1943,"tags":1944,"__hash__":1947},"blog\u002Fblog\u002Fen\u002Fapi-rate-limiting-redis.md","API Rate Limiting in Practice: Token Bucket vs. Sliding Window with Redis",{"type":8,"value":1301,"toc":1928},[1302,1305,1308,1319,1321,1325,1329,1336,1340,1343,1351,1355,1358,1360,1364,1371,1856,1858,1862,1865,1922,1925],[11,1303,1304],{},"Without API rate limiting, a single rogue script or misconfigured webhook client can fire 10,000 requests per second at your login or checkout endpoint, exhausting your database connection pool and taking your entire application down.",[11,1306,1307],{},"Rate limiting is the first line of defense against bot attacks, credential stuffing, and API resource abuse. But which algorithm should you implement?",[11,1309,1310,1311,1314,1315,1318],{},"In this article, we compare the two industry-standard algorithms — ",[15,1312,1313],{},"Token Bucket"," and ",[15,1316,1317],{},"Sliding Window Log"," — and show how to implement a high-speed sliding window rate limiter in Redis.",[34,1320],{},[37,1322,1324],{"id":1323},"_1-comparing-the-algorithms","1. Comparing the Algorithms",[130,1326,1328],{"id":1327},"a-fixed-window-counter-the-flawed-default","A. Fixed Window Counter (The Flawed Default)",[11,1330,1331,1332,1335],{},"Divides time into fixed buckets (e.g. 10:00 to 10:01). If a user can make 100 requests per minute, they can send 100 requests at 10:00:59, and another 100 requests at 10:01:01. That means ",[15,1333,1334],{},"200 requests in 2 seconds"," — double the intended burst limit!",[130,1337,1339],{"id":1338},"b-token-bucket","B. Token Bucket",[11,1341,1342],{},"A bucket holds a fixed number of tokens (burst capacity). Tokens are continuously replenished at a constant rate. Each incoming request consumes one token.",[102,1344,1345],{},[51,1346,1347,1350],{},[15,1348,1349],{},"Great for",": APIs that want to allow legitimate temporary traffic spikes while capping sustained throughput.",[130,1352,1354],{"id":1353},"c-sliding-window-counter-the-production-standard","C. Sliding Window Counter (The Production Standard)",[11,1356,1357],{},"Combines the low memory usage of fixed windows with the smoothness of a rolling window. It calculates the request rate by weighting the request count of the previous window and the current window.",[34,1359],{},[37,1361,1363],{"id":1362},"_2-sliding-window-rate-limiter-with-redis-sorted-sets","2. Sliding Window Rate Limiter with Redis Sorted Sets",[11,1365,1366,1367,1370],{},"Redis Sorted Sets (",[135,1368,1369],{},"ZSET",") allow us to track requests by timestamp with microsecond accuracy:",[142,1372,1374],{"className":144,"code":1373,"language":146,"meta":147,"style":147},"import Redis from 'ioredis'\n\nconst redis = new Redis(process.env.REDIS_URL!)\n\nexport async function checkRateLimit(identifier: string, limit = 60, windowInSeconds = 60) {\n  const now = Date.now()\n  const windowStart = now - (windowInSeconds * 1000)\n  const key = `ratelimit:${identifier}`\n\n  \u002F\u002F Atomic Redis Pipeline (Runs in a single round-trip)\n  const multi = redis.multi()\n  \u002F\u002F 1. Remove all request timestamps older than the active window\n  multi.zremrangebyscore(key, 0, windowStart)\n  \u002F\u002F 2. Count requests currently in the active window\n  multi.zcard(key)\n  \u002F\u002F 3. Add the current timestamp as a new request\n  multi.zadd(key, now, `${now}-${Math.random()}`)\n  \u002F\u002F 4. Set key expiration to auto-clean idle users\n  multi.expire(key, windowInSeconds)\n\n  const results = await multi.exec()\n  const currentCount = (results?.[1]?.[1] as number) || 0\n\n  if (currentCount >= limit) {\n    return {\n      allowed: false,\n      remaining: 0,\n      retryAfter: Math.ceil(windowInSeconds - ((now - windowStart) \u002F 1000))\n    }\n  }\n\n  return {\n    allowed: true,\n    remaining: limit - currentCount - 1,\n    retryAfter: 0\n  }\n}\n",[135,1375,1376,1390,1394,1422,1426,1469,1487,1513,1530,1534,1539,1556,1561,1577,1582,1592,1597,1631,1636,1646,1651,1672,1710,1715,1729,1737,1747,1757,1785,1791,1796,1801,1809,1819,1837,1846,1851],{"__ignoreMap":147},[151,1377,1378,1381,1384,1387],{"class":153,"line":154},[151,1379,1380],{"class":157},"import",[151,1382,1383],{"class":168}," Redis ",[151,1385,1386],{"class":157},"from",[151,1388,1389],{"class":227}," 'ioredis'\n",[151,1391,1392],{"class":153,"line":186},[151,1393,209],{"emptyLinePlaceholder":208},[151,1395,1396,1399,1402,1405,1407,1410,1413,1416,1419],{"class":153,"line":193},[151,1397,1398],{"class":157},"const",[151,1400,1401],{"class":179}," redis",[151,1403,1404],{"class":157}," =",[151,1406,295],{"class":157},[151,1408,1409],{"class":164}," Redis",[151,1411,1412],{"class":168},"(process.env.",[151,1414,1415],{"class":179},"REDIS_URL",[151,1417,1418],{"class":157},"!",[151,1420,1421],{"class":168},")\n",[151,1423,1424],{"class":153,"line":205},[151,1425,209],{"emptyLinePlaceholder":208},[151,1427,1428,1431,1434,1436,1439,1441,1444,1446,1448,1450,1453,1455,1458,1460,1463,1465,1467],{"class":153,"line":212},[151,1429,1430],{"class":157},"export",[151,1432,1433],{"class":157}," async",[151,1435,161],{"class":157},[151,1437,1438],{"class":164}," checkRateLimit",[151,1440,169],{"class":168},[151,1442,1443],{"class":172},"identifier",[151,1445,176],{"class":157},[151,1447,180],{"class":179},[151,1449,1039],{"class":168},[151,1451,1452],{"class":172},"limit",[151,1454,1404],{"class":157},[151,1456,1457],{"class":179}," 60",[151,1459,1039],{"class":168},[151,1461,1462],{"class":172},"windowInSeconds",[151,1464,1404],{"class":157},[151,1466,1457],{"class":179},[151,1468,183],{"class":168},[151,1470,1471,1474,1477,1479,1482,1485],{"class":153,"line":218},[151,1472,1473],{"class":157},"  const",[151,1475,1476],{"class":179}," now",[151,1478,1404],{"class":157},[151,1480,1481],{"class":168}," Date.",[151,1483,1484],{"class":164},"now",[151,1486,275],{"class":168},[151,1488,1489,1491,1494,1496,1499,1502,1505,1508,1511],{"class":153,"line":257},[151,1490,1473],{"class":157},[151,1492,1493],{"class":179}," windowStart",[151,1495,1404],{"class":157},[151,1497,1498],{"class":168}," now ",[151,1500,1501],{"class":157},"-",[151,1503,1504],{"class":168}," (windowInSeconds ",[151,1506,1507],{"class":157},"*",[151,1509,1510],{"class":179}," 1000",[151,1512,1421],{"class":168},[151,1514,1515,1517,1520,1522,1525,1527],{"class":153,"line":278},[151,1516,1473],{"class":157},[151,1518,1519],{"class":179}," key",[151,1521,1404],{"class":157},[151,1523,1524],{"class":227}," `ratelimit:${",[151,1526,1443],{"class":168},[151,1528,1529],{"class":227},"}`\n",[151,1531,1532],{"class":153,"line":290},[151,1533,209],{"emptyLinePlaceholder":208},[151,1535,1536],{"class":153,"line":321},[151,1537,1538],{"class":189},"  \u002F\u002F Atomic Redis Pipeline (Runs in a single round-trip)\n",[151,1540,1541,1543,1546,1548,1551,1554],{"class":153,"line":327},[151,1542,1473],{"class":157},[151,1544,1545],{"class":179}," multi",[151,1547,1404],{"class":157},[151,1549,1550],{"class":168}," redis.",[151,1552,1553],{"class":164},"multi",[151,1555,275],{"class":168},[151,1557,1558],{"class":153,"line":332},[151,1559,1560],{"class":189},"  \u002F\u002F 1. Remove all request timestamps older than the active window\n",[151,1562,1563,1566,1569,1572,1574],{"class":153,"line":338},[151,1564,1565],{"class":168},"  multi.",[151,1567,1568],{"class":164},"zremrangebyscore",[151,1570,1571],{"class":168},"(key, ",[151,1573,315],{"class":179},[151,1575,1576],{"class":168},", windowStart)\n",[151,1578,1579],{"class":153,"line":352},[151,1580,1581],{"class":189},"  \u002F\u002F 2. Count requests currently in the active window\n",[151,1583,1584,1586,1589],{"class":153,"line":962},[151,1585,1565],{"class":168},[151,1587,1588],{"class":164},"zcard",[151,1590,1591],{"class":168},"(key)\n",[151,1593,1594],{"class":153,"line":971},[151,1595,1596],{"class":189},"  \u002F\u002F 3. Add the current timestamp as a new request\n",[151,1598,1599,1601,1604,1607,1610,1612,1615,1618,1620,1623,1626,1629],{"class":153,"line":1154},[151,1600,1565],{"class":168},[151,1602,1603],{"class":164},"zadd",[151,1605,1606],{"class":168},"(key, now, ",[151,1608,1609],{"class":227},"`${",[151,1611,1484],{"class":168},[151,1613,1614],{"class":227},"}-${",[151,1616,1617],{"class":168},"Math",[151,1619,122],{"class":227},[151,1621,1622],{"class":164},"random",[151,1624,1625],{"class":227},"()",[151,1627,1628],{"class":227},"}`",[151,1630,1421],{"class":168},[151,1632,1633],{"class":153,"line":1160},[151,1634,1635],{"class":189},"  \u002F\u002F 4. Set key expiration to auto-clean idle users\n",[151,1637,1638,1640,1643],{"class":153,"line":1165},[151,1639,1565],{"class":168},[151,1641,1642],{"class":164},"expire",[151,1644,1645],{"class":168},"(key, windowInSeconds)\n",[151,1647,1649],{"class":153,"line":1648},20,[151,1650,209],{"emptyLinePlaceholder":208},[151,1652,1654,1656,1659,1661,1664,1667,1670],{"class":153,"line":1653},21,[151,1655,1473],{"class":157},[151,1657,1658],{"class":179}," results",[151,1660,1404],{"class":157},[151,1662,1663],{"class":157}," await",[151,1665,1666],{"class":168}," multi.",[151,1668,1669],{"class":164},"exec",[151,1671,275],{"class":168},[151,1673,1675,1677,1680,1682,1685,1688,1691,1693,1696,1698,1701,1704,1707],{"class":153,"line":1674},22,[151,1676,1473],{"class":157},[151,1678,1679],{"class":179}," currentCount",[151,1681,1404],{"class":157},[151,1683,1684],{"class":168}," (results?.[",[151,1686,1687],{"class":179},"1",[151,1689,1690],{"class":168},"]?.[",[151,1692,1687],{"class":179},[151,1694,1695],{"class":168},"] ",[151,1697,248],{"class":157},[151,1699,1700],{"class":179}," number",[151,1702,1703],{"class":168},") ",[151,1705,1706],{"class":157},"||",[151,1708,1709],{"class":179}," 0\n",[151,1711,1713],{"class":153,"line":1712},23,[151,1714,209],{"emptyLinePlaceholder":208},[151,1716,1718,1720,1723,1726],{"class":153,"line":1717},24,[151,1719,221],{"class":157},[151,1721,1722],{"class":168}," (currentCount ",[151,1724,1725],{"class":157},">=",[151,1727,1728],{"class":168}," limit) {\n",[151,1730,1732,1735],{"class":153,"line":1731},25,[151,1733,1734],{"class":157},"    return",[151,1736,287],{"class":168},[151,1738,1740,1743,1745],{"class":153,"line":1739},26,[151,1741,1742],{"class":168},"      allowed: ",[151,1744,577],{"class":179},[151,1746,580],{"class":168},[151,1748,1750,1753,1755],{"class":153,"line":1749},27,[151,1751,1752],{"class":168},"      remaining: ",[151,1754,315],{"class":179},[151,1756,580],{"class":168},[151,1758,1760,1763,1766,1769,1771,1774,1776,1779,1781,1783],{"class":153,"line":1759},28,[151,1761,1762],{"class":168},"      retryAfter: Math.",[151,1764,1765],{"class":164},"ceil",[151,1767,1768],{"class":168},"(windowInSeconds ",[151,1770,1501],{"class":157},[151,1772,1773],{"class":168}," ((now ",[151,1775,1501],{"class":157},[151,1777,1778],{"class":168}," windowStart) ",[151,1780,528],{"class":157},[151,1782,1510],{"class":179},[151,1784,318],{"class":168},[151,1786,1788],{"class":153,"line":1787},29,[151,1789,1790],{"class":168},"    }\n",[151,1792,1794],{"class":153,"line":1793},30,[151,1795,324],{"class":168},[151,1797,1799],{"class":153,"line":1798},31,[151,1800,209],{"emptyLinePlaceholder":208},[151,1802,1804,1807],{"class":153,"line":1803},32,[151,1805,1806],{"class":157},"  return",[151,1808,287],{"class":168},[151,1810,1812,1815,1817],{"class":153,"line":1811},33,[151,1813,1814],{"class":168},"    allowed: ",[151,1816,1036],{"class":179},[151,1818,580],{"class":168},[151,1820,1822,1825,1827,1830,1832,1835],{"class":153,"line":1821},34,[151,1823,1824],{"class":168},"    remaining: limit ",[151,1826,1501],{"class":157},[151,1828,1829],{"class":168}," currentCount ",[151,1831,1501],{"class":157},[151,1833,1834],{"class":179}," 1",[151,1836,580],{"class":168},[151,1838,1840,1843],{"class":153,"line":1839},35,[151,1841,1842],{"class":168},"    retryAfter: ",[151,1844,1845],{"class":179},"0\n",[151,1847,1849],{"class":153,"line":1848},36,[151,1850,324],{"class":168},[151,1852,1854],{"class":153,"line":1853},37,[151,1855,355],{"class":168},[34,1857],{},[37,1859,1861],{"id":1860},"_3-returning-standard-http-rate-limit-headers","3. Returning Standard HTTP Rate Limit Headers",[11,1863,1864],{},"Whenever your server answers a request, communicate rate limit states in the response headers (following IETF draft standards):",[142,1866,1868],{"className":487,"code":1867,"language":489,"meta":147,"style":147},"HTTP\u002F1.1 429 Too Many Requests\nRetry-After: 32\nX-RateLimit-Limit: 60\nX-RateLimit-Remaining: 0\nX-RateLimit-Reset: 1773489240\nContent-Type: application\u002Fjson\n\n{\n  \"error\": \"Too Many Requests\",\n  \"message\": \"Rate limit exceeded. Please retry in 32 seconds.\"\n}\n",[135,1869,1870,1875,1880,1885,1890,1895,1900,1904,1908,1913,1918],{"__ignoreMap":147},[151,1871,1872],{"class":153,"line":154},[151,1873,1874],{},"HTTP\u002F1.1 429 Too Many Requests\n",[151,1876,1877],{"class":153,"line":186},[151,1878,1879],{},"Retry-After: 32\n",[151,1881,1882],{"class":153,"line":193},[151,1883,1884],{},"X-RateLimit-Limit: 60\n",[151,1886,1887],{"class":153,"line":205},[151,1888,1889],{},"X-RateLimit-Remaining: 0\n",[151,1891,1892],{"class":153,"line":212},[151,1893,1894],{},"X-RateLimit-Reset: 1773489240\n",[151,1896,1897],{"class":153,"line":218},[151,1898,1899],{},"Content-Type: application\u002Fjson\n",[151,1901,1902],{"class":153,"line":257},[151,1903,209],{"emptyLinePlaceholder":208},[151,1905,1906],{"class":153,"line":278},[151,1907,566],{},[151,1909,1910],{"class":153,"line":290},[151,1911,1912],{},"  \"error\": \"Too Many Requests\",\n",[151,1914,1915],{"class":153,"line":321},[151,1916,1917],{},"  \"message\": \"Rate limit exceeded. Please retry in 32 seconds.\"\n",[151,1919,1920],{"class":153,"line":327},[151,1921,355],{},[11,1923,1924],{},"This ensures honest third-party API clients and mobile SDKs can automatically back off and retry without overwhelming your infrastructure.",[430,1926,1927],{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}",{"title":147,"searchDepth":186,"depth":186,"links":1929},[1930,1935,1936],{"id":1323,"depth":186,"text":1324,"children":1931},[1932,1933,1934],{"id":1327,"depth":193,"text":1328},{"id":1338,"depth":193,"text":1339},{"id":1353,"depth":193,"text":1354},{"id":1362,"depth":186,"text":1363},{"id":1860,"depth":186,"text":1861},"2026-09-14","Comparing rate-limiting algorithms to protect your backend against scrapers, credential stuffing, and bot spam with minimal latency overhead.",{},"\u002Fblog\u002Fen\u002Fapi-rate-limiting-redis",{"title":1299,"description":1938},"api-rate-limiting-redis","blog\u002Fen\u002Fapi-rate-limiting-redis",[1292,1945,1946,1293,454],"security","redis","KXTsuQOwj895dkbCDObhyO_wOncRKtB2ufJbjc-AUyc",1792236100672]