Skip to content

Instantly share code, notes, and snippets.

View RinatValiullov's full-sized avatar
👷‍♂️
Looking for a job

Rinat Valiullov RinatValiullov

👷‍♂️
Looking for a job
View GitHub Profile

My writing process

Stages of my writing process

  • Collecting material: For a number of topics that I may write about in the future, I have text files where I collect information as I come across it during coding, on the web, on Twitter, etc.

  • Outline: The collected material is my starting point. I rearrange it into an outline which I refine until I’m happy with it. Refining includes adding/removing/rearranging items and doing more research when I notice gaps in my knowledge.

  • Skeletal draft: I add bullet points and code examples until almost all of the content exists at least in skeletal form. This process often uncovers knowledge gaps and flaws in the structure of the content which I then can fix.

@subfuzion
subfuzion / README.md
Last active August 29, 2023 01:41
Node.js 18 Test Runner

Node.js 18 Test Runner

Node.js v18 introduces test runner support. This currently experimental feature gives developers the benefits of a structured test harness for their code without having to install a third party test framework, like Mocha or Jest, as a dependency. Using the test runner produces [TAP] output.

The [online reference] provides the most up-to-date, authoritative reference and have plenty of good testing examples. However, there are a few points that might not be immediately obvious from the reference, so those are highlighted here.

@pmeenan
pmeenan / wpt-hints.md
Last active March 18, 2023 16:48
Testing Priority Hints with WebPageTest

Priority Hints is rolling out to Chrome in the 101 release which is currently available in the Dev/Beta channel of Chrome and available in WebPageTest when using the Chrome Canary browser selection.

To make it easier to experiment with priority hints (particularly for LCP images) without making production changes, I set up a couple of public Cloudflare Workers that can be used dynamically with WebPageTest to inject priority hints into existing pages and to preload arbitrary images when combined with WebPageTest's overrideHost script command.

Injecting Priority Hints

There is a cloudflare worker at hint.perf.workers.dev that will take a CSS selector from the x-hint HTTP header and add fetchpriority=high to any elements in the HTML that match the selector. The easiest way to experiment with this is to use Chrome's dev tools locally, identify the element that hosts the imag

@joelonsql
joelonsql / PostgreSQL-EXTENSIONs.md
Last active March 27, 2024 00:19
1000+ PostgreSQL EXTENSIONs

🗺🐘 1000+ PostgreSQL EXTENSIONs

This is a list of URLs to PostgreSQL EXTENSION repos, listed in alphabetical order of parent repo, with active forks listed under each parent.

⭐️ >= 10 stars
⭐️⭐️ >= 100 stars
⭐️⭐️⭐️ >= 1000 stars
Numbers of stars might not be up-to-date.

Cheat sheet: Arrays

JavaScript Arrays are a very flexible data structure and used as lists, stacks, queues, tuples (e.g. pairs), etc. Some

Using Arrays

Creating Arrays, reading and writing elements:

function hyphenize(str) {
// /y is to make sure that there are no characters between the matches
// /g is so that .match() works the way we need here
// /u is not strictly necessary here, but generally a good habit
return str.match(/([a-z]{1,2})/uyg).join('-');
}
assert.equal(
hyphenize('hello'), 'he-ll-o'
);
@mjackson
mjackson / composing-route-in-react-router-v6.md
Last active March 12, 2024 08:39
Notes on route composition in React Router v6, along with a suggested improvement you can make today to start upgrading

Composing <Route> in React Router v6

Composition of <Route> elements in React Router is changing in v6 from how it worked in v4/5 and in Reach Router. React Router v6 is the successor of both React Router v5 and Reach Router.

This document explains our rationale for making the change as well as a pattern you will want to avoid in v6 and a note on how you can start preparing your v5 app for v6 today.

Background

In React Router v5, we had an example of how you could create a element](https://github.com/remix-run/react-router/blob/320be7afe44249d5c025659bc00c3276a19f0af9/packages/react-router-dom/examples/Auth.js#L50-L52) to restrict access to certain routes on the page. This element was a simple [wrapper around an actual element that made a simple decision: is the user authenticated or not? If so, ren

const app = {
init: () => {
document
.getElementById('btnGet')
.addEventListener('click', app.fetchWeather);
document
.getElementById('btnCurrent')
.addEventListener('click', app.getLocation);
},
fetchWeather: (ev) => {
@xiaochengh
xiaochengh / cascade-layer.md
Last active December 8, 2021 00:35
CSS cascade layer explainer

Use case: Set base style with a 3rd party library, and then override some style.

With cascade layers (spec), this can be done by simply putting 3rd party rules and author's own rules in different layers, so that author's own rules have higher priority than the 3rd party library.

There is no need to tweak selector specificity or source ordering.

3rd party style library: