Skip to content

Instantly share code, notes, and snippets.

Rafael Santos Sá rafael-sa

  • FixeAds
  • Lisboa
View GitHub Profile
@gaearon
gaearon / prepack-gentle-intro-1.md
Last active Jul 19, 2020
A Gentle Introduction to Prepack, Part 1
View prepack-gentle-intro-1.md

Note:

When this guide is more complete, the plan is to move it into Prepack documentation.
For now I put it out as a gist to gather initial feedback.

A Gentle Introduction to Prepack (Part 1)

If you're building JavaScript apps, you might already be familiar with some tools that compile JavaScript code to equivalent JavaScript code:

  • Babel lets you use newer JavaScript language features, and outputs equivalent code that targets older JavaScript engines.
@verpixelt
verpixelt / VisualRegressionTestingWithJavaScript.md
Last active Jun 14, 2017
A talk about the whys and hows of visual regression testing.
View VisualRegressionTestingWithJavaScript.md

Visual Regression Testing With JavaScript

Speaker Deck

My name is Kevin Lorenz, I'm a frontend developer with Finleap in Berlin, I'm one of the organizers of CSSconf EU and together with a few friends I run an event called CSSclasses.

If you want to talk to me on the web, you can find me on Twitter as @verpixelt, and I occasionally write articles on Medium, because a developer does not simply finish their own website.

Most of the time, I've called myself a developer, I've spent writing CSS.

@bevacqua
bevacqua / books.md
Last active Oct 13, 2018
Books I plan on buying this week
View books.md

Web Performance

  • High Performance Web Sites: Essential Knowledge for Front-End Engineers
  • High Performance JavaScript (Build Faster Web Application Interfaces)
  • Even Faster Web Sites: Performance Best Practices for Web Developers
  • Designing for Performance: Weighing Aesthetics and Speed

Web Design

  • Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement (2nd Edition) (Voices That Matter)
@joepie91
joepie91 / monolithic-vs-modular.md
Last active Jul 17, 2020
Monolithic vs. modular - what's the difference?
View monolithic-vs-modular.md

When you're developing in Node.js, you're likely to run into these terms - "monolithic" and "modular". They're usually used to describe the different types of frameworks and libraries; not just HTTP frameworks, but modules in general.

At a glance

  • Monolithic: "Batteries-included" and typically tightly coupled, it tries to include all the stuff that's needed for common usecases. An example of a monolithic web framework would be Sails.js.
  • Modular: "Minimal" and loosely coupled. Only includes the bare minimum of functionality and structure, and the rest is a plugin. Fundamentally, it generally only has a single 'responsibility'. An example of a modular web framework would be Express.

Coupled?

In software development, the terms "tightly coupled" and "loosely coupled" are used to indicate how much components rely on each other; or more specifically, how many assumptions they make about each other. This directly translates to how easy it is to repla

@rheinardkorf
rheinardkorf / Hooks.js
Last active Jul 31, 2020
Simple WordPress like hooks system for JavaScript.
View Hooks.js
/**
* @file A WordPress-like hook system for JavaScript.
*
* This file demonstrates a simple hook system for JavaScript based on the hook
* system in WordPress. The purpose of this is to make your code extensible and
* allowing other developers to hook into your code with their own callbacks.
*
* There are other ways to do this, but this will feel right at home for
* WordPress developers.
*
@paulirish
paulirish / what-forces-layout.md
Last active Aug 3, 2020
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

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
@sindresorhus
sindresorhus / post-merge
Last active Jul 26, 2020
git hook to run a command after `git pull` if a specified file was changed.In this example it's used to run `npm install` if package.json changed and `bower install` if `bower.json` changed.Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
View post-merge
#!/usr/bin/env bash
# MIT © Sindre Sorhus - sindresorhus.com
# git hook to run a command after `git pull` if a specified file was changed
# Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"
check_run() {
echo "$changed_files" | grep --quiet "$1" && eval "$2"
@austinhappel
austinhappel / readme.md
Last active Aug 5, 2019
Creating an HTTP(S) proxy for mobile devices using TinyProxy
View readme.md

Creating an HTTP(S) proxy for mobile devices using TinyProxy

TinyProxy isn't as easy to set up as a SOCKS proxy, but HTTP proxies are much easier to set up on mobile devices than SOCKS proxies are. So, after the initial setup on your desktop/server, it should be a piece of cake to set up other mobile devices to use the proxy.

Your computer

  1. Install TinyProxy. If you have macports, you can run:

         sudo port install TinyProxy
    
You can’t perform that action at this time.