Skip to content

Instantly share code, notes, and snippets.

View tomByrer's full-sized avatar
🎦
researching video players

Tom Byrer tomByrer

🎦
researching video players
View GitHub Profile
@paulirish
paulirish / what-forces-layout.md
Last active April 26, 2024 17:33
What forces layout/reflow. The comprehensive list.

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
@gitaarik
gitaarik / git_submodules.md
Last active April 22, 2024 10:52
Git Submodules basic explanation

Git Submodules basic explanation

Why submodules?

In Git you can add a submodule to a repository. This is basically a repository embedded in your main repository. This can be very useful. A couple of usecases of submodules:

  • Separate big codebases into multiple repositories.
@ljharb
ljharb / array_iteration_thoughts.md
Last active April 22, 2024 10:15
Array iteration methods summarized

Array Iteration

https://gist.github.com/ljharb/58faf1cfcb4e6808f74aae4ef7944cff

While attempting to explain JavaScript's reduce method on arrays, conceptually, I came up with the following - hopefully it's helpful; happy to tweak it if anyone has suggestions.

Intro

JavaScript Arrays have lots of built in methods on their prototype. Some of them mutate - ie, they change the underlying array in-place. Luckily, most of them do not - they instead return an entirely distinct array. Since arrays are conceptually a contiguous list of items, it helps code clarity and maintainability a lot to be able to operate on them in a "functional" way. (I'll also insist on referring to an array as a "list" - although in some languages, List is a native data type, in JS and this post, I'm referring to the concept. Everywhere I use the word "list" you can assume I'm talking about a JS Array) This means, to perform a single operation on the list as a whole ("atomically"), and to return a new list - thus making it mu

@bradtraversy
bradtraversy / webdev_online_resources.md
Last active April 17, 2024 12:44
Online Resources For Web Developers (No Downloading)
@malarkey
malarkey / Contract Killer 3.md
Last active April 16, 2024 21:44
The latest version of my ‘killer contract’ for web designers and developers

When times get tough and people get nasty, you’ll need more than a killer smile. You’ll need a killer contract.

Used by 1000s of designers and developers Clarify what’s expected on both sides Helps build great relationships between you and your clients Plain and simple, no legal jargon Customisable to suit your business Used on countless web projects since 2008

…………………………

@jonschlinkert
jonschlinkert / markdown-cheatsheet.md
Last active April 11, 2024 04:45
A better markdown cheatsheet.
@paulirish
paulirish / readme.md
Last active April 2, 2024 20:18
resolving the proper location and line number through a console.log wrapper

console.log wrap resolving for your wrapped console logs

I've heard this before:

What I really get frustrated by is that I cannot wrap console.* and preserve line numbers

We enabled this in Chrome DevTools via blackboxing a bit ago.

If you blackbox the script file the contains the console log wrapper, the script location shown in the console will be corrected to the original source file and line number. Click, and the full source is looking longingly into your eyes.

@DavidKuennen
DavidKuennen / minimal-analytics-snippet.js
Last active March 28, 2024 01:45
Minimal Analytics Snippet
(function (context, trackingId, options) {
const history = context.history;
const doc = document;
const nav = navigator || {};
const storage = localStorage;
const encode = encodeURIComponent;
const pushState = history.pushState;
const typeException = 'exception';
const generateId = () => Math.random().toString(36);
const getId = () => {
@dominictarr
dominictarr / readme.md
Created November 26, 2018 22:39
statement on event-stream compromise

Hey everyone - this is not just a one off thing, there are likely to be many other modules in your dependency trees that are now a burden to their authors. I didn't create this code for altruistic motivations, I created it for fun. I was learning, and learning is fun. I gave it away because it was easy to do so, and because sharing helps learning too. I think most of the small modules on npm were created for reasons like this. However, that was a long time ago. I've since moved on from this module and moved on from that thing too and in the process of moving on from that as well. I've written way better modules than this, the internet just hasn't fully caught up.

@broros

otherwise why would he hand over a popular package to a stranger?

If it's not fun anymore, you get literally nothing from maintaining a popular package.

One time, I was working as a dishwasher in a restu

@johnpolacek
johnpolacek / .gitconfig
Last active March 22, 2024 05:51
My current .gitconfig aliases
[alias]
co = checkout
cob = checkout -b
coo = !git fetch && git checkout
br = branch
brd = branch -d
brD = branch -D
merged = branch --merged
st = status
aa = add -A .