Kristóf Poduszló kripod

An issue we’ve heard from authors is that they want to know what scrollbars are doing and respond to that.

There’s a bunch of issues that might go hand in hand to actually solve this:

[^1] Expose an env() variable that allows you to get the scrollbar-size. This is a fixed value, independent of whether a scrollbar is shown or not – it just gives you back the size
[^2] A way to query which type of scrollbars are being used on the page.
A container state query to be able to know if something is overflowing or not

If you combine these three, authors can do things like:

I get asked pretty regularly what my opinion is on merge commits vs rebasing vs squashing. I've typed up this response so many times that I've decided to just put it in a gist so I can reference it whenever it comes up again.

I use merge, squash, rebase all situationally. I believe they all have their merits but their usage depends on the context. I think anyone who says any particular strategy is the right answer 100% of the time is wrong, but I think there is considerable acceptable leeway in when you use each. What follows is my personal and professional opinion:

V8

V8 is Google’s open source high-performance JavaScript and WebAssembly engine, written in C++. It is used in Chrome and in Node.js, among others. It implements ECMAScript and WebAssembly, and runs on Windows 7 or later, macOS 10.12+, and Linux systems that use x64, IA-32, ARM, or MIPS processors. V8 can run standalone, or can be embedded into any C++ application.

SpiderMonkey

SpiderMonkey is Mozilla’s JavaScript and WebAssembly Engine, used in Firefox, Servo and various other projects. It is written in C++, Rust and JavaScript. You can embed it into C++ and Rust projects, and it can be run as a stand-alone shell. It can also be [compiled](https://bytecodealliance.org/articles/making-javascript-run-fast-on

	import React, { Component, ErrorInfo, ReactNode } from 'react';
	import NextError from 'next/error';
	import { TRPCClientErrorLike } from '@trpc/client';
	import { AppRouter } from 'server/routers/_app';

	interface Props {
	children: ReactNode;
	}

	interface State {

	import invariant from "tiny-invariant";

	class AmalgoBox extends HTMLElement {
	get input() {
	return this.querySelector("input") as HTMLInputElement;
	}

	get button() {
	return this.querySelector("button") as HTMLButtonElement;
	}

	// Turn all HTML <a> elements into client side router links, no special framework-specific <Link> component necessary!
	// Example using the Next.js App Router.
	import { useRouter } from 'next/navigation';
	import { useEffect } from 'react';

	function useLinkHandler() {
	let router = useRouter();

	useEffect(() => {
	let onClick = e => {

	// Remember to install mini-svg-data-uri
	// Follow me on twitter for memes @jordienr

	import { type Config } from "tailwindcss";
	const {
	default: flattenColorPalette,
	} = require("tailwindcss/lib/util/flattenColorPalette");
	const svgToDataUri = require("mini-svg-data-uri");

	export default {

	/*
	Enabled by "strict":
	- alwaysStrict
	- noImplicitAny
	- noImplicitThis
	- strictNullChecks
	- strictBindCallApply
	- strictFunctionTypes
	- strictPropertyInitialization
	- useUnknownInCatchVariable

	import * as React from 'react';

	const useIsFirstRender = (): boolean => {
	const isFirst = React.useRef(true);

	if (isFirst.current) {
	isFirst.current = false;

	return true;
	} else {

	class PathMe {

	moves: string[] = [];

	constructor() {
	this.moves = [];
	return this;
	}

	moveTo(x: number, y: number) {