Skip to content

Instantly share code, notes, and snippets.

View devxleo's full-sized avatar

devxleo devxleo

  • Beijing, China
View GitHub Profile
@bvaughn
bvaughn / updating-subscriptions-when-props-change-example.js
Last active March 27, 2022 09:29
Advanced example for manually updating subscriptions in response to props changes in an async-safe way
// This is an advanced example! It is not typically required for application code.
// If you are using a library like Redux or MobX, use the container component provided by that library.
// If you are authoring such a library, use the technique shown below.
// This example shows how to safely update subscriptions in response to props changes.
// In this case, it is important to wait until `componentDidUpdate` before removing a subscription.
// In the event that a render is cancelled before being committed, this will prevent us from unsubscribing prematurely.
// We also need to be careful about how we handle events that are dispatched in between
// `getDerivedStateFromProps` and `componentDidUpdate` so that we don't put stale values into the `state`.
@bvaughn
bvaughn / updating-external-data-when-props-changes-using-promises.js
Last active July 20, 2023 16:00
Example for loading new external data in response to updated props
// This is an example of how to fetch external data in response to updated props,
// If you are using an async mechanism that does not support cancellation (e.g. a Promise).
class ExampleComponent extends React.Component {
_currentId = null;
state = {
externalData: null
};
@vasanthk
vasanthk / System Design.md
Last active May 6, 2024 20:21
System Design Cheatsheet

System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

Basic Steps

  1. Clarify and agree on the scope of the system
  • User cases (description of sequences of events that, taken together, lead to a system doing something useful)
    • Who is going to use it?
    • How are they going to use it?
@paulirish
paulirish / what-forces-layout.md
Last active May 6, 2024 07:54
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
@staltz
staltz / introrx.md
Last active May 6, 2024 01:44
The introduction to Reactive Programming you've been missing
@adilapapaya
adilapapaya / README
Last active June 27, 2020 11:58
Export Table Data to CSV using Javascript
Example code for exporting data in a table to a csv file.
@subfuzion
subfuzion / mongo-autostart-osx.md
Last active March 2, 2022 00:57
mongo auto start on OS X

Install with Homebrew

brew install mongodb

Set up launchctl to auto start mongod

$ ln -sfv /usr/local/opt/mongodb/*.plist ~/Library/LaunchAgents

/usr/local/opt/mongodb/ is a symlink to /usr/local/Cellar/mongodb/x.y.z (e.g., 2.4.9)

@jboner
jboner / latency.txt
Last active May 6, 2024 07:06
Latency Numbers Every Programmer Should Know
Latency Comparison Numbers (~2012)
----------------------------------
L1 cache reference 0.5 ns
Branch mispredict 5 ns
L2 cache reference 7 ns 14x L1 cache
Mutex lock/unlock 25 ns
Main memory reference 100 ns 20x L2 cache, 200x L1 cache
Compress 1K bytes with Zippy 3,000 ns 3 us
Send 1K bytes over 1 Gbps network 10,000 ns 10 us
Read 4K randomly from SSD* 150,000 ns 150 us ~1GB/sec SSD
@mislav
mislav / pagination.md
Created October 12, 2010 17:20
"Pagination 101" by Faruk Ateş

Pagination 101

Article by Faruk Ateş, [originally on KuraFire.net][original] which is currently down

One of the most commonly overlooked and under-refined elements of a website is its pagination controls. In many cases, these are treated as an afterthought. I rarely come across a website that has decent pagination, and it always makes me wonder why so few manage to get it right. After all, I'd say that pagination is pretty easy to get right. Alas, that doesn't seem the case, so after encouragement from Chris Messina on Flickr I decided to write my Pagination 101, hopefully it'll give you some clues as to what makes good pagination.

Before going into analyzing good and bad pagination, I want to explain just what I consider to be pagination: Pagination is any kind of control system that lets the user browse through pages of search results, archives, or any other kind of continued content. Search results are the o