[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"verticals":3,"home-articles-all":44,"home-packages":169,"search-suggestions":214,"weekly-game":247,"arcade-strip":262,"code:ts:true:10ilun4":321},[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":165},[46,79,103,124,144],{"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":76,"playground":78,"hasQuiz":17,"hasPlayground":17},"01a0ec73-2e41-711f-9f8a-b6c9bae1e054","vue-weekly-watch-vs-watcheffect","Vue watch vs watchEffect: The Complete Guide",null,"Vue's watch() and watchEffect() look interchangeable but track dependencies, run timing, and cleanup differently. The exact rules, verified against Vue 3.5.","\u002Fmedia\u002Fcovers\u002Fvue-weekly-watch-vs-watcheffect.png",15,"2026-10-12T06:10:54.504Z",69,{"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},"vue","Vue",[66,67,70,73],{"slug":63,"name":64,"color":50},{"slug":68,"name":69,"color":50},"javascript","Javascript",{"slug":71,"name":72,"color":50},"tutorial","Tutorial",{"slug":74,"name":75,"color":50},"webdev","Webdev",{"assessments":77},1,{"slug":48},{"id":80,"slug":81,"title":82,"subtitle":50,"excerpt":83,"coverUrl":84,"locale":13,"readingMinutes":85,"publishedAt":86,"viewCount":87,"likeCount":19,"commentCount":19,"author":88,"vertical":89,"topic":90,"tags":92,"_count":101,"playground":102,"hasQuiz":17,"hasPlayground":17},"01a114fb-f147-727a-a137-53c8ce35f6bf","service-worker-stale-cache-deploy","I Shipped a Fix. My Service Worker Kept Serving the Bug.","A critical bug fix went out, and support tickets kept coming in from people who swore they'd refreshed. The code was fine. The service worker's cache-first strategy was doing its job perfectly — which was the whole problem.","\u002Fmedia\u002Fcovers\u002Fservice-worker-stale-cache-deploy.png",6,"2026-10-12T06:10:22.830Z",57,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":68,"name":91},"JavaScript",[93,94,95,98],{"slug":68,"name":69,"color":50},{"slug":74,"name":75,"color":50},{"slug":96,"name":97,"color":50},"browser","Browser",{"slug":99,"name":100,"color":50},"performance","Performance",{"assessments":77},{"slug":81},{"id":104,"slug":105,"title":106,"subtitle":50,"excerpt":107,"coverUrl":108,"locale":13,"readingMinutes":109,"publishedAt":110,"viewCount":111,"likeCount":19,"commentCount":19,"author":112,"vertical":113,"topic":114,"tags":117,"_count":122,"playground":123,"hasQuiz":17,"hasPlayground":17},"01a11d02-8b28-774b-9f36-fb66bece8e50","nuxt-weekly-4-migration-breaking-changes","Nuxt 4 Migration: The Breaking Changes That Actually Bite","Nuxt 3 reached end-of-life on July 31, 2026. Here's exactly what breaks moving to Nuxt 4 — directories, data fetching, TypeScript — plus a cheat sheet.","\u002Fmedia\u002Fcovers\u002Fnuxt-weekly-4-migration-breaking-changes.png",14,"2026-10-11T12:26:26.492Z",108,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":115,"name":116},"nuxt","Nuxt",[118,119,120,121],{"slug":115,"name":116,"color":50},{"slug":68,"name":69,"color":50},{"slug":71,"name":72,"color":50},{"slug":74,"name":75,"color":50},{"assessments":77},{"slug":105},{"id":125,"slug":126,"title":127,"subtitle":50,"excerpt":128,"coverUrl":129,"locale":13,"readingMinutes":85,"publishedAt":130,"viewCount":131,"likeCount":19,"commentCount":19,"author":132,"vertical":133,"topic":134,"tags":135,"_count":142,"playground":143,"hasQuiz":17,"hasPlayground":17},"01a10fd5-be9a-719b-8acf-e0e930c602f8","long-animation-frames-api","Your Lighthouse Score Is 100. Long Animation Frames Explain the Jank.","Lighthouse says 100 and CI is green, but a user still says the filter button feels sluggish. The Long Animation Frames API names the exact script and phase that blocked the frame — here's how to read it instead of squinting at a flame chart.","\u002Fmedia\u002Fcovers\u002Flong-animation-frames-api.png","2026-10-11T12:25:55.553Z",118,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":68,"name":91},[136,137,138,139],{"slug":68,"name":69,"color":50},{"slug":99,"name":100,"color":50},{"slug":74,"name":75,"color":50},{"slug":140,"name":141,"color":50},"programming","Programming",{"assessments":77},{"slug":126},{"id":145,"slug":146,"title":147,"subtitle":50,"excerpt":148,"coverUrl":149,"locale":13,"readingMinutes":150,"publishedAt":151,"viewCount":152,"likeCount":19,"commentCount":19,"author":153,"vertical":154,"topic":155,"tags":158,"_count":163,"playground":164,"hasQuiz":17,"hasPlayground":17},"01a117e0-acb2-740f-9391-db919729cf21","react-weekly-fragment-refs","React 19.3 Fragment Refs: Skip the Wrapper Div for a Ref","React 19.3 Fragment Refs let you ref a sibling group with no wrapper div. Learn the FragmentInstance API, its limits, and get a copy-paste cheat sheet.","\u002Fmedia\u002Fcovers\u002Freact-weekly-fragment-refs.png",13,"2026-10-10T12:12:38.989Z",152,{"id":57,"name":58,"username":59,"avatarUrl":50,"headline":60},{"slug":6,"name":7,"accentFrom":10,"accentTo":11},{"slug":156,"name":157},"react","React",[159,160,161,162],{"slug":156,"name":157,"color":50},{"slug":68,"name":69,"color":50},{"slug":71,"name":72,"color":50},{"slug":74,"name":75,"color":50},{"assessments":77},{"slug":146},{"page":77,"perPage":166,"total":167,"totalPages":168},5,157,32,{"items":170,"meta":213},[171,187,200],{"id":172,"slug":173,"name":173,"scope":50,"registry":174,"tagline":175,"ecosystem":63,"repoUrl":176,"docsUrl":177,"registryUrl":178,"license":179,"isOfficial":18,"weekOf":50,"latestVersion":180,"stars":77,"weeklyDownloads":181,"voteCount":77,"publishedAt":182,"submittedBy":183,"vertical":184,"tags":185,"hasVoted":18},"019fe845-897a-7625-9d65-6d0c7ffe5afa","god-kit","NPM","God Kit — design tokens and Vue 3 primitives for God Plan apps","https:\u002F\u002Fgithub.com\u002Fgod-plans\u002Fgod-kit","https:\u002F\u002Fgodkit.godplans.org\u002F","https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fgod-kit","MIT","0.8.9",20,"2026-05-01T11:34:17.384Z",{"id":57,"name":58,"username":59,"avatarUrl":50},{"slug":6,"name":7},[186],{"slug":63,"name":64},{"id":188,"slug":189,"name":189,"scope":50,"registry":174,"tagline":190,"ecosystem":68,"repoUrl":50,"docsUrl":191,"registryUrl":192,"license":179,"isOfficial":18,"weekOf":50,"latestVersion":193,"stars":19,"weeklyDownloads":194,"voteCount":77,"publishedAt":195,"submittedBy":196,"vertical":197,"tags":198,"hasVoted":18},"019fe845-7fda-7479-bc73-dd73217eba66","cross-framework","Source-to-source converter: React to Vue (and more)","https:\u002F\u002Fcross-framework.netlify.app\u002F","https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fcross-framework","0.1.4",22,"2026-03-25T08:15:50.328Z",{"id":57,"name":58,"username":59,"avatarUrl":50},{"slug":6,"name":7},[199],{"slug":68,"name":69},{"id":201,"slug":202,"name":202,"scope":50,"registry":174,"tagline":203,"ecosystem":63,"repoUrl":204,"docsUrl":50,"registryUrl":205,"license":179,"isOfficial":18,"weekOf":50,"latestVersion":206,"stars":43,"weeklyDownloads":207,"voteCount":19,"publishedAt":208,"submittedBy":209,"vertical":210,"tags":211,"hasVoted":18},"019fe845-82d6-712b-9d51-53e88dff04de","vue-heic-image","Vue 3 HEIC\u002FHEIF image preview and converter for the browser: HeicImage component, useHeicImage composable, PNG\u002FJPEG\u002FGIF output, TypeScript, iOS photos,…","https:\u002F\u002Fgithub.com\u002Fparsajiravand\u002Fvue-heic-image","https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fvue-heic-image","2.0.0",8,"2026-03-24T20:45:24.802Z",{"id":57,"name":58,"username":59,"avatarUrl":50},{"slug":6,"name":7},[212],{"slug":63,"name":64},{"page":77,"perPage":43,"total":53,"totalPages":166},[215,217,219,223,225,229,231,235,237,238,242,246],{"slug":74,"name":75,"articles":216},135,{"slug":68,"name":69,"articles":218},111,{"slug":220,"name":221,"articles":222},"frontend","Frontend",82,{"slug":71,"name":72,"articles":224},52,{"slug":226,"name":227,"articles":228},"css","Css",42,{"slug":99,"name":100,"articles":230},19,{"slug":232,"name":233,"articles":234},"typescript","Typescript",18,{"slug":156,"name":157,"articles":236},16,{"slug":96,"name":97,"articles":150},{"slug":239,"name":240,"articles":241},"node","Node",12,{"slug":243,"name":244,"articles":245},"accessibility","Accessibility",9,{"slug":140,"name":141,"articles":245},{"id":248,"slug":249,"title":250,"tagline":251,"genre":252,"surface":253,"coverUrl":254,"accentFrom":38,"accentTo":11,"motif":255,"weekKey":256,"featured":17,"sessionSeconds":257,"freeLevels":43,"playCount":258,"playerCount":259,"releaseAt":260,"publishedAt":261},"01a09b23-9e30-76d8-8b1d-b3abd9d61c37","neon-snake","Neon Snake","The one everybody already knows how to play.","ARCADE","CANVAS","\u002Fcovers\u002Fgames\u002Fneon-snake.png","snake","2026-W37",90,10,4,"2026-09-08T09:00:00.000Z","2026-09-13T14:21:47.710Z",{"items":263,"meta":319},[264,265,280,291,302,312],{"id":248,"slug":249,"title":250,"tagline":251,"genre":252,"surface":253,"coverUrl":254,"accentFrom":38,"accentTo":11,"motif":255,"weekKey":256,"featured":17,"sessionSeconds":257,"freeLevels":43,"playCount":258,"playerCount":259,"releaseAt":260,"publishedAt":261},{"id":266,"slug":267,"title":268,"tagline":269,"genre":270,"surface":271,"coverUrl":272,"accentFrom":273,"accentTo":274,"motif":275,"weekKey":276,"featured":18,"sessionSeconds":277,"freeLevels":50,"playCount":31,"playerCount":77,"releaseAt":278,"publishedAt":279},"01a09b23-a070-72da-824c-732950e5dfbe","reaction-time","Reaction Time","Green means click. Everything else is you being too eager.","REFLEX","DOM","\u002Fcovers\u002Fgames\u002Freaction-time.png","rose-400","red-500","pulse","2026-W39",45,"2026-09-22T09:00:00.000Z","2026-09-22T09:00:00.082Z",{"id":281,"slug":282,"title":283,"tagline":284,"genre":285,"surface":271,"coverUrl":286,"accentFrom":287,"accentTo":10,"motif":288,"weekKey":256,"featured":18,"sessionSeconds":289,"freeLevels":77,"playCount":43,"playerCount":43,"releaseAt":260,"publishedAt":290},"01a09b23-a030-7352-b796-a475b5d99aac","block-fit","Block Fit","Three shapes at a time. No falling, no timer, no mercy.","PUZZLE","\u002Fcovers\u002Fgames\u002Fblock-fit.png","fuchsia-400","blocks",300,"2026-09-13T15:08:36.615Z",{"id":292,"slug":293,"title":294,"tagline":295,"genre":296,"surface":271,"coverUrl":297,"accentFrom":298,"accentTo":299,"motif":300,"weekKey":256,"featured":18,"sessionSeconds":301,"freeLevels":50,"playCount":31,"playerCount":31,"releaseAt":260,"publishedAt":261},"01a09b23-9ff2-74bf-b26c-989fa40d0d4e","daily-word","Daily Word","One five-letter word. Six guesses. Everybody gets the same one.","WORD","\u002Fcovers\u002Fgames\u002Fdaily-word.png","lime-400","emerald-500","letters",180,{"id":303,"slug":304,"title":305,"tagline":306,"genre":285,"surface":271,"coverUrl":307,"accentFrom":308,"accentTo":309,"motif":310,"weekKey":256,"featured":18,"sessionSeconds":311,"freeLevels":31,"playCount":168,"playerCount":166,"releaseAt":260,"publishedAt":261},"01a09b23-9fb2-73cc-9755-81a427f2b7c4","minesweeper","Minesweeper","Thirty years old and still the best logic puzzle on a computer.","\u002Fcovers\u002Fgames\u002Fminesweeper.png","sky-400","indigo-500","grid",240,{"id":313,"slug":314,"title":314,"tagline":315,"genre":285,"surface":271,"coverUrl":316,"accentFrom":26,"accentTo":317,"motif":318,"weekKey":256,"featured":18,"sessionSeconds":289,"freeLevels":77,"playCount":19,"playerCount":19,"releaseAt":260,"publishedAt":261},"01a09b23-9f6f-74a5-a27a-21414662f65c","2048","Slide, merge, and try to stop at exactly the wrong moment.","\u002Fcovers\u002Fgames\u002F2048.png","orange-500","tiles",{"total":85,"nextDropAt":320},"2026-10-13T09:00:00.000Z","\u003Cdiv class=\"shj shj-lang-ts shj-multiline\" data-lang=\"ts\">\u003Cdiv class=\"shj-scroll\">\u003Cdiv class=\"shj-numbers\">\u003Cdiv>1\u003C\u002Fdiv>\u003Cdiv>2\u003C\u002Fdiv>\u003Cdiv>3\u003C\u002Fdiv>\u003Cdiv>4\u003C\u002Fdiv>\u003Cdiv>5\u003C\u002Fdiv>\u003Cdiv>6\u003C\u002Fdiv>\u003Cdiv>7\u003C\u002Fdiv>\u003C\u002Fdiv>\u003Cdiv class=\"shj-code\">\u003Cspan class=\"shj-kwd\">const\u003C\u002Fspan> developer \u003Cspan class=\"shj-oper\">=\u003C\u002Fspan> \u003Cspan class=\"shj-bracket\">{\u003C\u002Fspan>\n  learn\u003Cspan class=\"shj-oper\">:\u003C\u002Fspan> \u003Cspan class=\"shj-bool\">true\u003C\u002Fspan>\u003Cspan class=\"shj-oper\">,\u003C\u002Fspan>\n  build\u003Cspan class=\"shj-oper\">:\u003C\u002Fspan> \u003Cspan class=\"shj-bool\">true\u003C\u002Fspan>\u003Cspan class=\"shj-oper\">,\u003C\u002Fspan>\n  ship\u003Cspan class=\"shj-oper\">:\u003C\u002Fspan> \u003Cspan class=\"shj-bool\">true\u003C\u002Fspan>\u003Cspan class=\"shj-oper\">,\u003C\u002Fspan>\n\u003Cspan class=\"shj-bracket\">}\u003C\u002Fspan>\n\n\u003Cspan class=\"shj-kwd\">await\u003C\u002Fspan> developer\u003Cspan class=\"shj-oper\">.\u003C\u002Fspan>\u003Cspan class=\"shj-func\">learn\u003C\u002Fspan>\u003Cspan class=\"shj-bracket\">(\u003C\u002Fspan>\u003Cspan class=\"shj-bracket\">)\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002Fdiv>\u003C\u002Fdiv>"]