compilator

[compilator]

Compilator: Week in Review #1

Web development

New way to create modals using HTML only

Which open-source monospaced font is best for coding?

Drawing a star with DOMMatrix

The State of HTML 2023 survey is now open!

What are JWTs/Jots/JSON Web Tokens?

From WebGL to WebGPU

Ultimate solution for generating placeholder images

Productivity

What Causes Bad CLS and How to Fix it?

Get All That Network Activity Under Control with Priority Hints

Css

The Path To Awesome CSS Easing With The linear() Function

A (more) Modern CSS Reset

CSS Findings From The Threads App: Part 2

Responsive type scales with composable CSS utilities

JavaScript

Speeding up the JavaScript ecosystem - Polyfills gone rogue

How to Code Dark Mode for Google Sheets with Apps Script and JavaScript

Understanding the JavaScript Modulo Operator

The Origins of TypeScript: A Documentary

React

Optimizing Provider Context Usage in React

Build Your Own ChatGPT Clone with React and the OpenAI API

How to Build an Accordion Component with React.js

v0: “AI tool from Vercel that works like Midjourney for React, that is, it issues code snippets based on your requests (prompts)

Bootstrap a React app with smol developer

Understanding Props in React — A Comprehensive Guide

Vue

Clean Layout Architecture for Vue Applications

Optimizing Vue.js apps with web workers

7 Quick Tips about Vue Styles You (Might) Didn’t Know

Svelte

Introducing runes

Exploring Astro and Svelte vs. SvelteKit: A comparative guide

How to Build an Etch-A-Sketch App with Svelte

Libs & Plugins

Benchmarks for JS minifiers: babel-minify, esbuild, terser, uglify-js, swc, google closure compiler, tdewolff/minify

MouseMove - JavaScript mouse cursor behavior automation for web presentation

Browser

Nue JS is an extremely small (2.3kb) JavaScript library for creating web interfaces. This is the core of the future Nue ecosystem. It is similar to Vue.js, React.js or Svelte, but without hooks, effects, props, portals, watchers, providers, injects, suspension and other unusual abstractions in your way!

swup 4 - a universal library for creating transitions between pages. It manages the full page load life cycle and seamlessly adds animation between the current and next pages.

What's new in DevTools (Chrome 118)

WebKit features in Safari 17.0

---------

Image by vectorpocket on Freepik

[compilator]

Easy image placeholder generator

Don't waste your time in vain, use the placeholder generation service - placeholder.ink

How it works

It's a seamless process! Simply pick your preferred size, customize the color, and add text as needed. Voila! You'll receive a customized image perfectly tailored to your requirements.

The default JPEG placeholder

When you opt for the default settings, we generate a JPEG placeholder image to match your specified dimensions. It comes with a classic gray background and adheres to your chosen image size. <img src="https://jpg.placeholder.ink/600x250" alt="600x250">

Customize background colors

Personalize the background hue by specifying your preferred HEX color code, comprised of six digits. <img src="https://jpg.placeholder.ink/600x250/ffc2fa" alt="600x250/ffc2fa">

Include text into your image

Elevate your image with textual elements. For multiple words, simply use a plus sign (+) in place of spaces. <img src="https://jpg.placeholder.ink/600x250/8ac9eb/compilator" alt="600x250/8ac9eb/compilator">

Welcome to placeholder.ink—happy coding!