Skip to content

Instantly share code, notes, and snippets.

View gielcobben's full-sized avatar
💩
Hi

Giel gielcobben

💩
Hi
View GitHub Profile
@fwielstra
fwielstra / api.js
Created June 14, 2011 14:46
An example NodeJS / Mongoose / Express application based on their respective tutorials
/* The API controller
Exports 3 methods:
* post - Creates a new thread
* list - Returns a list of threads
* show - Displays a thread and its posts
*/
var Thread = require('../models/thread.js');
var Post = require('../models/post.js');
@Warry
Warry / Article.md
Created December 11, 2012 00:11
How to make faster scroll effects?

How to make faster scroll effects?

  • Avoid too many reflows (the browser to recalculate everything)
  • Use advanced CSS3 for graphic card rendering
  • Precalculate sizes and positions

Beware of reflows

The reflow appens as many times as there are frames per seconds. It recalculate all positions that change in order to diplay them. Basically, when you scroll you execute a function where you move things between two reflows. But there are functions that triggers reflows such as jQuery offset, scroll... So there are two things to take care about when you dynamically change objects in javascript to avoid too many reflows:

@bastianallgeier
bastianallgeier / nginx
Last active November 30, 2023 10:14
nginx setup
# block content
location ~ ^/content/(.*).(txt|md|mdown)$ {
rewrite ^/content/(.*).(txt|md|mdown)$ /error redirect;
}
# block all files in the site folder from being accessed directly
location ~ ^/site/(.*)$ {
rewrite ^/site/(.*)$ /error redirect;
}
@bendc
bendc / functional-utils.js
Last active September 15, 2023 12:12
A set of pure ES2015 functions aimed to make functional JavaScript more idiomatic.
// array utils
// =================================================================================================
const combine = (...arrays) => [].concat(...arrays);
const compact = arr => arr.filter(Boolean);
const contains = (() => Array.prototype.includes
? (arr, value) => arr.includes(value)
: (arr, value) => arr.some(el => el === value)
@simurai
simurai / README.md
Last active November 28, 2019 05:39
Atom for minimalists

For minimalist ❤️ ers

minimalist

Just you, your code and nothing else.... :meditatingbuddha:

@bendc
bendc / personal-raf-boilerplate.js
Last active January 21, 2018 17:19
requestAnimationFrame boilerplate code
"use strict";
// animation utils
// ===============
const trackTime = timing => {
const now = performance.now();
if (!timing.startTime) timing.startTime = now;
const elapsed = now - timing.startTime;
@bendc
bendc / simulate-typing.js
Created September 1, 2017 08:57
Fake typing animation
const trackTime = timing => {
const now = performance.now();
if (!timing.startTime) timing.startTime = now;
const elapsed = now - timing.startTime;
const {duration} = timing;
if (duration != null && duration <= elapsed) timing.startTime = null;
return elapsed;
};
const delay = (callback, duration) => {
@SylarRuby
SylarRuby / userAvatar.js
Last active June 21, 2024 14:48
NodeJs AWS S3 Upload
/**
* This gist was inspired from https://gist.github.com/homam/8646090 which I wanted to work when uploading an image from
* a base64 string.
* Updated to use Promise (bluebird)
* Web: https://mayneweb.com
*
* @param {string} base64 Data
* @return {string} Image url
*/
const imageUpload = async (base64) => {
@morajabi
morajabi / useRect.js
Created February 18, 2019 14:35
useRect — getBoundingClientRect() React Hook with resize handler
import { useLayoutEffect, useCallback, useState } from 'react'
export const useRect = (ref) => {
const [rect, setRect] = useState(getRect(ref ? ref.current : null))
const handleResize = useCallback(() => {
if (!ref.current) {
return
}
@koenbok
koenbok / store.ts
Last active November 10, 2023 00:17
import * as React from "react";
/**
A hook to simply use state between components
Warning: this only works with function components (like any hook)
Usage:
// You can put this in an central file and import it too
const useStore = createStore({ count: 0 })