[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"verticals":3,"tag-webdev-13":44,"search-suggestions":302,"tags-all":327},[4,20,32],{"id":5,"slug":6,"name":7,"tagline":8,"description":9,"accentFrom":10,"accentTo":11,"icon":12,"defaultLocale":13,"locales":14,"features":16,"position":19},"019fe637-3d33-714b-b57f-23e163ffca0c","dev","Web Development","Read it. Run it. Prove it.","A post a day on modern web development — most with an editable playground and a quiz that explains every answer. Free, no account needed.","violet-500","cyan-400","◇","en",[13,15],"fa",{"courses":17,"paths":17,"articles":17,"exams":18,"flashcards":18,"packages":17,"community":17,"certificates":17,"teams":17,"commerce":17},true,false,0,{"id":21,"slug":22,"name":23,"tagline":24,"description":25,"accentFrom":26,"accentTo":10,"icon":27,"defaultLocale":13,"locales":28,"features":30,"position":31},"019fe637-3dc2-754c-8657-0f175bfee7c6","lang","Languages","Learn a language the way you learn a codebase.","Grammar explained the way good documentation explains an API — one idea at a time, each with a quiz.","amber-400","⌘",[13,15,29],"es",{"courses":18,"paths":18,"articles":17,"exams":18,"flashcards":17,"packages":18,"community":17,"certificates":17,"teams":18,"commerce":18},2,{"id":33,"slug":34,"name":35,"tagline":36,"description":37,"accentFrom":38,"accentTo":39,"icon":40,"defaultLocale":13,"locales":41,"features":42,"position":43},"7b3c16f2-931d-410e-802e-e1fa4edab7de","soft","Soft Skills","The half of the job nobody wrote documentation for.","Weekly, on the parts of working life that decide more than your code does — first weeks, meetings, interviews, promotions, and the people around you. Written from what actually happens, and recorded as a podcast you can listen to on the walk.","emerald-400","teal-300","◉",[13],{"courses":18,"paths":18,"articles":17,"exams":18,"flashcards":18,"packages":18,"community":17,"certificates":18,"teams":18,"commerce":18},3,{"items":45,"meta":299},[46,80,99,120,140,161,181,202,222,240,260,278],{"id":47,"slug":48,"title":49,"subtitle":50,"excerpt":51,"coverUrl":52,"locale":13,"readingMinutes":53,"publishedAt":54,"viewCount":55,"likeCount":19,"commentCount":19,"author":56,"vertical":61,"topic":62,"tags":65,"_count":77,"playground":79,"hasQuiz":17,"hasPlayground":17},"019fe660-75da-727d-a751-32f8723b0b38","using-explicit-resource-management","You still write `finally { resource.close() }`. The `using` keyword does it automatically.",null,"The Explicit Resource Management proposal adds a `using` declaration that calls cleanup the moment a scope exits — normal return, early return, or throw. No more try\u002Ffinally boilerplate for timers, event listeners, connections, or any other resource you need to release.","\u002Fmedia\u002Fcovers\u002Fusing-explicit-resource-management.png",4,"2026-07-24T08:33:28.459Z",653,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},"019fe637-3c25-7088-9034-39c9f15dc3c8","Parsa Jiravand","parsa","Frontend engineer · building bestpractic",{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":63,"name":64},"typescript","TypeScript",[66,68,71,74],{"slug":63,"name":67,"color":50},"Typescript",{"slug":69,"name":70,"color":50},"javascript","Javascript",{"slug":72,"name":73,"color":50},"webdev","Webdev",{"slug":75,"name":76,"color":50},"frontend","Frontend",{"assessments":78},1,{"slug":48},{"id":81,"slug":82,"title":83,"subtitle":50,"excerpt":84,"coverUrl":85,"locale":13,"readingMinutes":53,"publishedAt":86,"viewCount":87,"likeCount":19,"commentCount":19,"author":88,"vertical":89,"topic":90,"tags":92,"_count":97,"playground":98,"hasQuiz":17,"hasPlayground":17},"019fe660-6e7e-72cb-bd34-bc123056cfeb","set-methods-union-intersection","You've been doing Set math by hand. JavaScript finally shipped `.union()`, `.intersection()`, and friends.","Set has always been missing its obvious operations. ES2025 adds `.union()`, `.intersection()`, `.difference()`, `.symmetricDifference()`, and three boolean predicates — native methods that used to require four lines of spread syntax each.","\u002Fmedia\u002Fcovers\u002Fset-methods-union-intersection.png","2026-07-23T08:37:02.144Z",563,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},"JavaScript",[93,94,95,96],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":63,"name":67,"color":50},{"assessments":78},{"slug":82},{"id":100,"slug":101,"title":102,"subtitle":50,"excerpt":103,"coverUrl":104,"locale":13,"readingMinutes":105,"publishedAt":106,"viewCount":107,"likeCount":19,"commentCount":19,"author":108,"vertical":109,"topic":110,"tags":111,"_count":118,"playground":119,"hasQuiz":17,"hasPlayground":17},"019fe660-66d6-71c3-b71a-ed9102b874c8","promise-with-resolvers","You keep escaping the Promise constructor. `Promise.withResolvers` does it right.","The 'deferred promise' pattern — storing resolve and reject outside the constructor so you can call them later — is a daily JavaScript idiom that's always felt awkward. ES2024 added a one-liner for it.","\u002Fmedia\u002Fcovers\u002Fpromise-with-resolvers.png",5,"2026-07-22T08:35:52.029Z",787,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},[112,113,114,115],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":63,"name":67,"color":50},{"slug":116,"name":117,"color":50},"asyncjs","Asyncjs",{"assessments":78},{"slug":101},{"id":121,"slug":122,"title":123,"subtitle":50,"excerpt":124,"coverUrl":125,"locale":13,"readingMinutes":53,"publishedAt":126,"viewCount":127,"likeCount":19,"commentCount":19,"author":128,"vertical":129,"topic":130,"tags":131,"_count":138,"playground":139,"hasQuiz":17,"hasPlayground":17},"019fe660-5f55-701e-9cf4-dc0c9f0517b9","error-cause-rethrow-context","You're rethrowing errors and losing context. `Error.cause` fixes that.","Every time you catch an error and rethrow a new one without forwarding the original, you lose the stack trace, the error type, and everything useful about what actually went wrong. ES2022 added `Error.cause` to fix exactly this.","\u002Fmedia\u002Fcovers\u002Ferror-cause-rethrow-context.png","2026-07-21T08:36:02.331Z",670,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},[132,133,134,137],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":135,"name":136,"color":50},"node","Node",{"slug":63,"name":67,"color":50},{"assessments":78},{"slug":122},{"id":141,"slug":142,"title":143,"subtitle":50,"excerpt":144,"coverUrl":145,"locale":13,"readingMinutes":146,"publishedAt":147,"viewCount":148,"likeCount":19,"commentCount":19,"author":149,"vertical":150,"topic":151,"tags":152,"_count":159,"playground":160,"hasQuiz":17,"hasPlayground":17},"019fe660-57eb-7258-b452-d66ff04d2380","weekly-typescript-generics","TypeScript Generics: The Complete Guide (with Cheat Sheet)","Learn TypeScript generics from the ground up — generic functions, constraints, defaults, and classes — with worked examples and a copy-paste cheat sheet.","\u002Fmedia\u002Fcovers\u002Fweekly-typescript-generics.png",15,"2026-07-20T09:23:23.621Z",725,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":63,"name":64},[153,154,155,158],{"slug":63,"name":67,"color":50},{"slug":69,"name":70,"color":50},{"slug":156,"name":157,"color":50},"tutorial","Tutorial",{"slug":72,"name":73,"color":50},{"assessments":78},{"slug":142},{"id":162,"slug":163,"title":164,"subtitle":50,"excerpt":165,"coverUrl":166,"locale":13,"readingMinutes":53,"publishedAt":167,"viewCount":168,"likeCount":19,"commentCount":19,"author":169,"vertical":170,"topic":171,"tags":172,"_count":179,"playground":180,"hasQuiz":17,"hasPlayground":17},"019fe660-503a-7133-b7b0-7d5ce9587539","intersection-observer-visibility","Your scroll listener fires on every pixel. `IntersectionObserver` fires when visibility actually changes.","Detecting whether an element is in the viewport by listening to scroll events runs an expensive layout calculation on every frame. `IntersectionObserver` is the browser-native alternative — it fires only when visibility changes, off the main thread, with no scroll handler involved.","\u002Fmedia\u002Fcovers\u002Fintersection-observer-visibility.png","2026-07-19T08:25:59.411Z",524,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},[173,174,175,176],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":177,"name":178,"color":50},"performance","Performance",{"assessments":78},{"slug":163},{"id":182,"slug":183,"title":184,"subtitle":50,"excerpt":185,"coverUrl":186,"locale":13,"readingMinutes":105,"publishedAt":187,"viewCount":188,"likeCount":19,"commentCount":19,"author":189,"vertical":190,"topic":191,"tags":194,"_count":200,"playground":201,"hasQuiz":17,"hasPlayground":17},"019fe660-48c5-70fe-a5b4-b20c5b2661e7","css-anchor-positioning","You're using Floating UI to position your tooltip. The browser does it natively now.","CSS Anchor Positioning is Baseline 2026 — it lets any element declare itself an anchor and any floating element position relative to it in pure CSS. No JavaScript, no layout math, no ResizeObserver wiring.","\u002Fmedia\u002Fcovers\u002Fcss-anchor-positioning.png","2026-07-18T07:59:42.250Z",542,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":192,"name":193},"css","CSS",[195,197,198,199],{"slug":192,"name":196,"color":50},"Css",{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":69,"name":70,"color":50},{"assessments":78},{"slug":183},{"id":203,"slug":204,"title":205,"subtitle":50,"excerpt":206,"coverUrl":207,"locale":13,"readingMinutes":105,"publishedAt":208,"viewCount":209,"likeCount":19,"commentCount":19,"author":210,"vertical":211,"topic":212,"tags":213,"_count":220,"playground":221,"hasQuiz":17,"hasPlayground":17},"019fe660-416e-7357-854c-5a7b56d68629","css-logical-properties","Your `margin-left` doesn't exist in Arabic. CSS logical properties fix that.","Physical CSS properties like `margin-left` and `padding-right` break silently when a layout needs to support right-to-left languages. Logical properties replace the physical axis with a writing-mode-aware model — one codebase, every direction.","\u002Fmedia\u002Fcovers\u002Fcss-logical-properties.png","2026-07-17T08:18:05.044Z",604,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":192,"name":193},[214,215,216,217],{"slug":192,"name":196,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":218,"name":219,"color":50},"html","Html",{"assessments":78},{"slug":204},{"id":223,"slug":224,"title":225,"subtitle":50,"excerpt":226,"coverUrl":227,"locale":13,"readingMinutes":105,"publishedAt":228,"viewCount":229,"likeCount":19,"commentCount":19,"author":230,"vertical":231,"topic":232,"tags":233,"_count":238,"playground":239,"hasQuiz":17,"hasPlayground":17},"019fe660-39f9-768b-be22-fcd49b6abf6d","css-subgrid-nested-grid-alignment","Your CSS Grid cards look misaligned. `subgrid` is the fix you didn't know existed.","CSS Grid controls your outer container, but its children can't participate in the same tracks. `subgrid` closes that gap — nested elements align to the parent grid's rows and columns without padding hacks, fixed heights, or JavaScript measurements.","\u002Fmedia\u002Fcovers\u002Fcss-subgrid-nested-grid-alignment.png","2026-07-16T08:21:27.248Z",838,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":192,"name":193},[234,235,236,237],{"slug":192,"name":196,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":218,"name":219,"color":50},{"assessments":78},{"slug":224},{"id":241,"slug":242,"title":243,"subtitle":50,"excerpt":244,"coverUrl":245,"locale":13,"readingMinutes":105,"publishedAt":246,"viewCount":247,"likeCount":19,"commentCount":19,"author":248,"vertical":249,"topic":250,"tags":251,"_count":258,"playground":259,"hasQuiz":17,"hasPlayground":17},"019fe660-32b6-757d-a975-3860df795f67","immutable-array-methods","Your `.sort()` is mutating state. JavaScript finally gave you the fix.","The classic array methods — sort, reverse, splice — mutate the original array, silently breaking React state updates and surprising anyone who forgot to spread first. ES2023 added four immutable counterparts: toSorted, toReversed, toSpliced, and with.","\u002Fmedia\u002Fcovers\u002Fimmutable-array-methods.png","2026-07-15T08:22:28.270Z",498,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},[252,253,254,255],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":256,"name":257,"color":50},"react","React",{"assessments":78},{"slug":242},{"id":261,"slug":262,"title":263,"subtitle":50,"excerpt":264,"coverUrl":265,"locale":13,"readingMinutes":53,"publishedAt":266,"viewCount":267,"likeCount":19,"commentCount":19,"author":268,"vertical":269,"topic":270,"tags":271,"_count":276,"playground":277,"hasQuiz":17,"hasPlayground":17},"019fe660-2b2e-71fb-a0d1-fd1509765d3b","object-groupby-replace-reduce","You've been writing this `reduce` a hundred times. `Object.groupBy` does it in one.","Grouping an array by a key is one of the most common data transforms in frontend code. You've been wiring it by hand with `reduce` for years. `Object.groupBy` is the native version — no helper, no library, no ceremony.","\u002Fmedia\u002Fcovers\u002Fobject-groupby-replace-reduce.png","2026-07-14T08:16:56.309Z",423,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},[272,273,274,275],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":75,"name":76,"color":50},{"slug":135,"name":136,"color":50},{"assessments":78},{"slug":262},{"id":279,"slug":280,"title":281,"subtitle":50,"excerpt":282,"coverUrl":283,"locale":13,"readingMinutes":284,"publishedAt":285,"viewCount":286,"likeCount":19,"commentCount":19,"author":287,"vertical":288,"topic":289,"tags":290,"_count":297,"playground":298,"hasQuiz":17,"hasPlayground":17},"019fe660-2335-7652-9e51-7c6f28871874","weekly-javascript-event-loop","JavaScript Event Loop Explained: The Complete Guide","Learn how the JavaScript event loop really works — call stack, microtasks, and macrotasks — with worked examples, edge cases, and a cheat sheet.","\u002Fmedia\u002Fcovers\u002Fweekly-javascript-event-loop.png",13,"2026-07-13T09:36:33.464Z",944,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":69,"name":91},[291,292,293,294],{"slug":69,"name":70,"color":50},{"slug":72,"name":73,"color":50},{"slug":156,"name":157,"color":50},{"slug":295,"name":296,"color":50},"programming","Programming",{"assessments":78},{"slug":280},{"page":284,"perPage":300,"total":301,"totalPages":146},12,174,[303,304,306,308,310,312,314,316,318,320,324,326],{"slug":72,"name":73,"articles":301},{"slug":69,"name":70,"articles":305},141,{"slug":75,"name":76,"articles":307},96,{"slug":156,"name":157,"articles":309},71,{"slug":192,"name":196,"articles":311},51,{"slug":177,"name":178,"articles":313},30,{"slug":63,"name":67,"articles":315},25,{"slug":256,"name":257,"articles":317},20,{"slug":295,"name":296,"articles":319},19,{"slug":321,"name":322,"articles":323},"browser","Browser",18,{"slug":135,"name":136,"articles":325},16,{"slug":218,"name":219,"articles":300},[328,329,330,331,332,333,334,335,336,337,338,339,340,344,348,351,355,359,362,365,369,372,376,379,382,385,388,391,394,397,400,403,406,409,412,415,418,421,424,427],{"slug":72,"name":73,"color":50,"articles":301},{"slug":69,"name":70,"color":50,"articles":305},{"slug":75,"name":76,"color":50,"articles":307},{"slug":156,"name":157,"color":50,"articles":309},{"slug":192,"name":196,"color":50,"articles":311},{"slug":177,"name":178,"color":50,"articles":313},{"slug":63,"name":67,"color":50,"articles":315},{"slug":256,"name":257,"color":50,"articles":317},{"slug":295,"name":296,"color":50,"articles":319},{"slug":321,"name":322,"color":50,"articles":323},{"slug":135,"name":136,"color":50,"articles":325},{"slug":218,"name":219,"color":50,"articles":300},{"slug":341,"name":342,"color":50,"articles":343},"nextjs","Nextjs",11,{"slug":345,"name":346,"color":50,"articles":347},"vue","Vue",10,{"slug":349,"name":350,"color":50,"articles":347},"accessibility","Accessibility",{"slug":352,"name":353,"color":50,"articles":354},"nestjs","Nestjs",9,{"slug":356,"name":357,"color":50,"articles":358},"nuxt","Nuxt",8,{"slug":360,"name":361,"color":50,"articles":358},"career","Career",{"slug":363,"name":364,"color":50,"articles":358},"discuss","Discuss",{"slug":366,"name":367,"color":50,"articles":368},"beginners","Beginners",7,{"slug":370,"name":371,"color":50,"articles":368},"productivity","Productivity",{"slug":373,"name":374,"color":50,"articles":375},"grammar","Grammar",6,{"slug":377,"name":378,"color":50,"articles":105},"security","Security",{"slug":380,"name":381,"color":50,"articles":53},"ssr","SSR",{"slug":383,"name":384,"color":50,"articles":53},"apis","Apis",{"slug":386,"name":387,"color":50,"articles":43},"ai","Ai",{"slug":389,"name":390,"color":50,"articles":43},"api","API",{"slug":392,"name":393,"color":50,"articles":43},"caching","Caching",{"slug":395,"name":396,"color":50,"articles":31},"async","Async",{"slug":398,"name":399,"color":50,"articles":31},"forms","Forms",{"slug":401,"name":402,"color":50,"articles":31},"dom","Dom",{"slug":404,"name":405,"color":50,"articles":31},"backend","Backend",{"slug":407,"name":408,"color":50,"articles":31},"english","English",{"slug":410,"name":411,"color":50,"articles":31},"verbs","Verbs",{"slug":413,"name":414,"color":50,"articles":31},"spanish","Spanish",{"slug":416,"name":417,"color":50,"articles":31},"a1","A1",{"slug":419,"name":420,"color":50,"articles":31},"a2","A2",{"slug":422,"name":423,"color":50,"articles":31},"tenses","Tenses",{"slug":425,"name":426,"color":50,"articles":31},"turkish","Turkish",{"slug":428,"name":429,"color":50,"articles":31},"animation","Animation"]