Gianmarco Ladvace

Crippling Facebook

Facebook works with advertisers to target you. These instructions are one of the many ways to begin crippling that relationship. When AI targeting is crippled, your psychosecurity improves :)

On your desktop machine, goto https://accountscenter.facebook.com/ads/audience_based_advertising
Maximize the browser window
Press F12 and click on the Console tab
Select the code below, copy it, paste it upon the Console line (The area next to the > character in the Console window), and press enter:

This is a simple Tailwind plugin to expose all of Tailwind's colors, including any custom ones, as custom css properties on the :root element.

There are a couple of main reasons this is helpful:

You can reference all of Tailwind's colors—including any custom ones you define—from handwritten CSS code.
You can define all of your colors within the Tailwind configuration, and access the final values programmatically, which isn't possible if you did it the other way around: referencing custom CSS variables (defined in CSS code) from your Tailwind config.

See the Tailwind Plugins for more info on plugins.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

CSS units

Recommendations of unit types per media type:

Media	Recommended	Occasional use	Infrequent use	Not recommended
Screen	em, rem, %	px	ch, ex, vw, vh, vmin, vmax	cm, mm, in, pt, pc
Print	em, rem, %	cm, mm, in, pt, pc	ch, ex	px, vw, vh, vmin, vmax

Relative units

	// Construct Single Node
	class Node {
	constructor(data, next = null) {
	this.data = data;
	this.next = next;
	}
	}

	// Create/Get/Remove Nodes From Linked List
	class LinkedList {

	// See https://blog.isquaredsoftware.com/presentations/react-redux-ts-intro-2020-12/#/36 for slides
	// My basic render function structure:
	function RenderLogicExample({
	someBoolean, // 1) Destructure values from `props` object
	someList,
	}) {
	// 2) Declare state values
	const [a, setA] = useState(0);
	const [b, setB] = useState(0);