The latest articles on DEV Community by Marc (@marcradziwill). https://dev.to/marcradziwill https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F137505%2Ffbc4a08b-65c7-4e37-88e2-26f05fa619c7.png https://dev.to/marcradziwill en Marc Mon, 30 Nov 2020 12:17:04 +0000 https://dev.to/marcradziwill/quiz-web-performance-30-4k19 https://dev.to/marcradziwill/quiz-web-performance-30-4k19 <p>Caching is essential for web performance. How much do you know about it?</p> <p>What does max-age in the HTTP cache headers stand for?</p> <ul> <li>The time a cache expires.</li> <li>The maximum amount of time a resource is considered fresh.</li> <li>The time a service worker caches fonts.</li> <li>The max-age of an image.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-does-max-age-in-the-http-cache-headers-stand-for/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Mon, 30 Nov 2020 12:16:43 +0000 https://dev.to/marcradziwill/quiz-web-performance-29-5387 https://dev.to/marcradziwill/quiz-web-performance-29-5387 <p>Quiz time! Today it's about fonts.</p> <p>What does font-display mean?</p> <ul> <li>Tells the developer which font he should download locally.</li> <li>The font-display property defines how font files are loaded and displayed by the browser.</li> <li>Tells the browser what font the website has.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-does-font-display-means/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Mon, 30 Nov 2020 12:16:29 +0000 https://dev.to/marcradziwill/quiz-web-performance-28-4lkn https://dev.to/marcradziwill/quiz-web-performance-28-4lkn <p>How many pages include at least one third-party script?</p> <ul> <li>93.59%</li> <li>81.53%</li> <li>52.49%</li> <li>16.41%</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/how-many-pages-include-at-least-one-third-party-script/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Fri, 27 Nov 2020 09:53:38 +0000 https://dev.to/marcradziwill/quiz-web-performance-27-1dlo https://dev.to/marcradziwill/quiz-web-performance-27-1dlo <p>Check out the web performance question of the day!</p> <p>What is the Critical Rendering Path?</p> <ul> <li>A critical request chain of the website.</li> <li>A circular reference in JavaScript files.</li> <li>A wrong path to an image.</li> <li>A sequence of steps the browser has du complete to display the website.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-the-critical-rendering-path/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Thu, 26 Nov 2020 12:07:24 +0000 https://dev.to/marcradziwill/quiz-web-performance-26-5fe4 https://dev.to/marcradziwill/quiz-web-performance-26-5fe4 <p>Quiz time! Today it's about CSS.</p> <p>What is critical CSS?</p> <ul> <li>CSS that is deprecated.</li> <li>CSS that is unused.</li> <li>Critical CSS is a technique that extracts the CSS for above-the-fold content in order to render content to the user as fast as possible.</li> <li>CSS bug that is hard to find.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-critical-css/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Thu, 26 Nov 2020 12:07:15 +0000 https://dev.to/marcradziwill/quiz-web-performance-25-18ka https://dev.to/marcradziwill/quiz-web-performance-25-18ka <p>Quiz time, folks! </p> <p>What is code-splitting?</p> <ul> <li>Splitting the codebase into smaller parts that are loaded on demand.</li> <li>Doing code-review by more than 2 people</li> <li>Share code parts with a developer colleague</li> <li>Split a task in frontend and backend development.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-code-splitting/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Tue, 24 Nov 2020 10:03:48 +0000 https://dev.to/marcradziwill/quiz-web-performance-24-3k46 https://dev.to/marcradziwill/quiz-web-performance-24-3k46 <p>Quiz time! Read what's to question of the day.</p> <p>What is the module/nomodule pattern?</p> <ul> <li>A web performance monitoring pattern.</li> <li>A method in CSS to wrap images into modules.</li> <li>A pattern to export a WebAssembly component from RUST.</li> <li>A pattern that describes the practice of serving only modern code to modern browsers and only code to old browsers.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-the-modulenomodule-pattern/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Mon, 23 Nov 2020 07:13:11 +0000 https://dev.to/marcradziwill/quiz-web-performance-23-2i0p https://dev.to/marcradziwill/quiz-web-performance-23-2i0p <p>What are modern web image formats?</p> <ul> <li>WebP &amp; AVIF</li> <li>PicWeb &amp; JPD</li> <li>AVIP &amp; PNA</li> <li>TIF &amp; RAP</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-are-modern-web-image-formats/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Mon, 23 Nov 2020 07:13:01 +0000 https://dev.to/marcradziwill/quiz-web-performance-22-3040 https://dev.to/marcradziwill/quiz-web-performance-22-3040 <p>Do you know Brotli?</p> <ul> <li>An HTML tag for Breadcrumbs.</li> <li>A compression algorithm.</li> <li>A well-known web performance company.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-brotli/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Mon, 23 Nov 2020 07:12:32 +0000 https://dev.to/marcradziwill/quiz-web-performance-21-323e https://dev.to/marcradziwill/quiz-web-performance-21-323e <p>What is a performance budget?</p> <ul> <li>The amount of money a team can spend on optimizations.</li> <li>A performance budget is a set of limits imposed on metrics that affect site performance.</li> <li>The revenue that a company has more through performance optimizations.</li> <li>The profit that a company ears through performance optimizations.</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-a-performance-budget/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Fri, 20 Nov 2020 11:01:37 +0000 https://dev.to/marcradziwill/quiz-web-performance-20-37a1 https://dev.to/marcradziwill/quiz-web-performance-20-37a1 <p>Response time is an important topic.</p> <p>What is the maximum response time you should aim for the completion of the whole task?</p> <ul> <li>50 ms</li> <li>100 ms</li> <li>200 ms</li> <li>250 ms</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-is-the-maximum-response-time-you-should-aim-for-the-completion-of-the-whole-task/">Answer the question</a></center> </h2> challenge webperf webdev quiz Marc Thu, 19 Nov 2020 08:52:05 +0000 https://dev.to/marcradziwill/quiz-web-performance-19-i5m https://dev.to/marcradziwill/quiz-web-performance-19-i5m <p>Why are 16ms for each task, not the single truth?</p> <p>What time in ms should you aim for animations in the real world rather than the 16ms?</p> <ul> <li>10 ms</li> <li>20 ms</li> <li>12 ms</li> <li>8 ms</li> </ul> <h2> <center><a href="https://marcradziwill.com/web-performance-quiz/what-time-in-ms-should-you-aim-for-animations-in-the-real-world-rather-than-the-16ms/">Answer the question</a></center> </h2> challenge webperf webdev quiz