Skip to content

Instantly share code, notes, and snippets.

export const chaosTestStrings = (): void => {
const textNodes = getAllTextNodes(document.body);
for (const node of textNodes) {
const textNodeLength = node.textContent ? node.textContent.length : 0;
if (node.textContent === null) {
return;
}
if (node.parentElement instanceof Element) {
if (node.parentElement.dataset.originalText === undefined) {
/*
* Usage:
* <PopoverStickOnHover
* component={<div>Holy guacamole! I'm Sticky.</div>}
* placement="top"
* onMouseEnter={() => { }}
* delay={200}
* >
* <div>Show the sticky tooltip</div>
* </PopoverStickOnHover>
@slightlyoff
slightlyoff / push_payloads_userland.md
Last active September 30, 2022 23:11
Delivering H/2 Push Payloads To Userland

Background

One of the biggest missed opportunities thus far with HTTP/2 ("H/2") is that we are not yet able to sunset WebSockets in favor of H/2. Web Sockets and H/2 both support multiplexing messages bi-directionally and can send both textual and binary data.

Server Sent Events ("SSE"), by contrast, are not bi-directional (they're a "server-push-only" channel) and binary data cannot be sent easily. They are, however, very simple to implement. Adding to the menagerie of options, RTCPeerConnection can also be used to signal data to applications in a low-latency (but potentially lossy) way.

Because H/2 [does not support the handshake (upgrade) that WebSockets use to negotiate a connection](https://daniel.haxx.se/blog/2016/06/15/no-websockets-

@wojteklu
wojteklu / clean_code.md
Last active June 20, 2024 21:37
Summary of 'Clean code' by Robert C. Martin

Code is clean if it can be understood easily – by everyone on the team. Clean code can be read and enhanced by a developer other than its original author. With understandability comes readability, changeability, extensibility and maintainability.


General rules

  1. Follow standard conventions.
  2. Keep it simple stupid. Simpler is always better. Reduce complexity as much as possible.
  3. Boy scout rule. Leave the campground cleaner than you found it.
  4. Always find root cause. Always look for the root cause of a problem.

Design rules

@Rich-Harris
Rich-Harris / service-workers.md
Last active June 14, 2024 06:20
Stuff I wish I'd known sooner about service workers

Stuff I wish I'd known sooner about service workers

I recently had several days of extremely frustrating experiences with service workers. Here are a few things I've since learned which would have made my life much easier but which isn't particularly obvious from most of the blog posts and videos I've seen.

I'll add to this list over time – suggested additions welcome in the comments or via twitter.com/rich_harris.

Use Canary for development instead of Chrome stable

Chrome 51 has some pretty wild behaviour related to console.log in service workers. Canary doesn't, and it has a load of really good service worker related stuff in devtools.

/**
* SystemJS hook that caches load and transpilation results of sources that haven't changed in IndexedDB storage.
* In Chrome dev tools the cache is easily managed under Resources > IndexedDB > jspm
* There's a global dependency on Dexie.js (ex: //npmcdn.com/dexie@1.3.3/dist/dexie.min.js)
* Add the following to your index.ghtml <script src="http://npmcdn.com/dexie@1.3.3/dist/dexie.min.js"></script>
* Adapted from https://gist.github.com/ineentho/70303c2ccdb69ad3661d
*/
;(function(){
var db = new Dexie("jspm");
db.version(1).stores({ files: "&url,format,hash,contents" });
@ericlaw1979
ericlaw1979 / CertSH.js
Last active January 31, 2018 14:12
Integrate a CRT.SH tab into Fiddler to show diagnostic information about the server's (or executable's) certificate
// Click Rules > Customize Rules. Inside the HANDLERS class, add the following block:
public BindUITab("CertInfo", "<html>")
static function CRTSHReport(arrSess: Session[]):String {
if ((arrSess.Length != 1) ||
( !arrSess[0].isTunnel &&
!(arrSess[0].bHasResponse &&
(arrSess[0].responseBodyBytes.Length > 2) &&
(arrSess[0].responseBodyBytes[0] == 0x4d) &&
@ericlaw1979
ericlaw1979 / AutoSizeSessionList.js
Created January 6, 2016 14:29
This FiddlerScript autosizes the width of the Web Sessions list based on whether it contains focus. Adjust width constants to taste.
// Click Rules > Customize Rules
// Inside your existing onboot handler, add two lines:
static function OnBoot() {
FiddlerApplication.UI.pnlSessions.add_Enter(panelEnter);
FiddlerApplication.UI.pnlSessions.add_Leave(panelExit);
// Just before that method in the Handlers class, add:
public static
@gregdeane
gregdeane / system.yuml.js
Last active February 25, 2017 13:42
Helper method to visually display SystemJS dependency relationships using http://yuml.me/
System.trace = true;
window.showModuleRelationships = function () {
var modules = Object.keys(System.loads)
.map(function (moduleName) {
return System.loads[moduleName];
});
function displayName(module) {
return module
.replace(System.baseURL, '')