{"resource":{"title":"Foundations: Why Image Optimisation Matters & How Browsers Load Images","isPremium":true,"requires":["premium.fsd"],"content":{"type":1,"body":"*Part 1 of 8 — Image Optimisation for the Modern Web*\r\n\r\nIt's a familiar pattern. A team profiles their app to figure out why a page feels slow. The JavaScript bundle is lean. The API is fast. The CSS is minified, gzipped, and tree-shaken. Everything the performance checklists ask for has been done....","isInternal":true},"isActive":true,"stats":{"views":21,"used":0,"likes":0},"published":true,"author":{"id":"3eh0kijZwMrHum8TkMqX","name":"Devtools Tech","username":"devtoolstech"},"resourceId":"CLrYWAoK0LTA67R9oV9H","slug":"foundations-why-image-optimisation-matters-and-how-browsers-load-images---rid---CLrYWAoK0LTA67R9oV9H","createdAt":1779622248760,"showPaywall":true,"needsUpgrade":true},"currentUser":null,"isOwner":false,"recommendations":{"questions":[{"_id":"692ed637697e24762d33bf74","content":{"languages":["javascript","typescript"],"difficulty":2},"tags":["javascript","coding","ui","ux","algorithms","data structures","frontend"],"slug":"identical-dom-trees---qid---uGJkyIch5BHsO71axwsY","title":"Identical DOM Trees","questionId":"uGJkyIch5BHsO71axwsY"},{"_id":"625983f11195627fe9f0bf77","content":{"languages":["javascript","typescript"],"difficulty":2},"tags":["javascript","lodash","memo","frontend","interview question","polyfill","problem solving","algorithm","frontend masters","egghead","codedamn","memoize","advanced javascript","frontend fundamentals"],"slug":"how-to-implement-memoize-function-or-javascript-interview-question-or-problem-solving---qid---RxWt8Q1Mr2iwCPJHrkkr","title":"How to implement memoize function | JavaScript Interview Question | Problem Solving","questionId":"RxWt8Q1Mr2iwCPJHrkkr"},{"_id":"67e53e9c347ebdb1a74b907c","content":{"languages":["javascript","typescript"],"difficulty":2},"tags":["javascript","amazon","frontend interview question","ui","ux","javascript promises","blog","amazon interview question"],"slug":"implement-promisify-polyfill---qid---GFqT2ainSIGaPNODqoDe","title":"Implement Promisify Polyfill","questionId":"GFqT2ainSIGaPNODqoDe"},{"_id":"6373bc7b9cbdb764d46a0ec0","content":{"languages":["javascript","typescript"],"difficulty":1},"tags":["","javascript","arrays","javascript polyfills","interview question","frontend","coding","devtools tech","programming","codedamn","frontend masters","egghead","razorpay","hotstar","tata1mg","swiggy","zomato","array","custom unshift","array push"],"slug":"how-to-implement-array-prototype-push-javascript-interview-question-or-problem-solving-or-javascript-polyfills---qid---W3kxb3R36UKmCjPhoVAd","title":"How to implement Array.prototype.push? JavaScript Interview Question | Problem Solving | JavaScript Polyfills","questionId":"W3kxb3R36UKmCjPhoVAd"},{"_id":"6278dce36865f21215beeece","content":{"languages":["react","html"],"difficulty":1},"tags":["javascript","react","begineer","ui","forntend challenge","coding problems","problem solving","mockups","ux","interview","frontend coding challenges","codedamn","frontend masters"],"slug":"how-to-build-a-text-converter-or-frontend-coding-challenge-or-react-js-or-beginner---qid---OX4jbE2JFb2DS5mO8Vu7","title":"How to build a Text Converter? | Frontend Coding Challenge | React.js | Beginner","questionId":"OX4jbE2JFb2DS5mO8Vu7"}],"resources":[{"_id":"697b25a8132ce4e954d59b37","content":{"difficulty":1,"domain":2,"type":1,"isInternal":true,"languages":[]},"tags":[""],"slug":"rippling-frontend-interview-experience---rid---n4yp5bZBiParUibIGjEe","title":"Rippling Frontend Interview Experience","resourceId":"n4yp5bZBiParUibIGjEe"},{"_id":"6a12e1684b3e6d922c549f09","content":{"difficulty":1,"domain":1,"type":1,"isInternal":true,"languages":[]},"tags":["javascript","image","optimisations","ui","ux","devtools tech","tutorial","article","blog","image optimisations"],"slug":"foundations-why-image-optimisation-matters-and-how-browsers-load-images---rid---CLrYWAoK0LTA67R9oV9H","title":"Foundations: Why Image Optimisation Matters & How Browsers Load Images","resourceId":"CLrYWAoK0LTA67R9oV9H"},{"_id":"69a7c7b992f33c7d8aa04c41","content":{"difficulty":1,"domain":1,"type":2,"isInternal":false,"languages":[]},"tags":["javascript","ui","ux","devtools tech","coding","frontend","polyfill"],"slug":"implementing-javascript-promise-polyfill---rid---9ExnAPiGr8eioZLa9IeV","title":"Implementing JavaScript Promise Polyfill","resourceId":"9ExnAPiGr8eioZLa9IeV"},{"_id":"631050a877f9961d5b7ce988","content":{"difficulty":2,"domain":1,"type":2,"isInternal":false},"tags":["javascript","frontend","react","redux","devtools","tooling","state management"],"slug":"create-your-own-redux-or-part-2-or-createstore-api-or-advanced-frontend---rid---H9EEn90tE3Jag6zCfNkM","title":"Create Your Own Redux | Part 2 | CreateStore API | Advanced Frontend","resourceId":"H9EEn90tE3Jag6zCfNkM"},{"_id":"662a9bac4079503047f8376b","content":{"difficulty":4,"domain":2,"type":1,"isInternal":true,"languages":[]},"tags":["javascript","frontend","code","react","list performance","ui","ux","devtools tech","microsoft"],"slug":"how-to-improve-list-rendering-performance-in-a-react-app-or-list-virtualization-or-microsoft-frontend-interview-question---rid---AgCMhGtE8GZmJa5cKY71","title":"How to improve list rendering performance in a React app? | List Virtualization | Microsoft Frontend Interview Question","resourceId":"AgCMhGtE8GZmJa5cKY71"}]}}