loilo

/*
 * These are some types I found useful during some tricky TypeScript programming.
 * Many of them are not too common or intuitive to come up with, this is why I'm writing them down here for future lookup.
 *
 * Note: Be careful when copy-pasting, some of these types depend on others.
 */


/**
 * Various utilities for working with classes

loilo

Sort by Samples

A sorting function that takes an array of samples. All sortable items which occur in the samples will be arranged in the order they occur there, all other items will be appended to the end in their original order or sorted with an optional provided comparision algorithm.

This can be useful when the items to sort are not completely known, but there are some well-known ones that should come first:

const pages = [ 'About', 'Products', 'Home', 'Contact', 'Carreer' ]

// No idea what pages exist, but if "Home" and "About" exist, they should come first

loilo

/**
 * Mock an object with a proxy, overriding methods and properties
 *
 * @param {object} object An object to mock
 * @param {object} implementations The properties/methods to virtually "merge" into the mocked object
 */
function moxy(object, implementations) {
  return new Proxy(object, {
    get(target, key, receiver) {
      if (key in implementations) {

loilo

Vue Responsive Container

A container component reacting to breakpoints on its own width or height, powered by ResizeObserver and scoped slots.

It is similar to things like vue-resize in that you can use it to observe a component's size. However the ResponsiveContainer will not emit any events, its whole point is to work as declaratively as possible, taking a predefined set of breakpoints you can access in your component.

Try the demo on CodeSandbox.

Basic Usage

loilo

Find Free Port with PHP

This is a quick way to find a random free port on a system using PHP:

$port = find_free_port();

Benchmarked locally, where finding a port always took around 0.15ms.

loilo

Access PHP Variables in Nested Closures

This post was inspired by having to pass around ReactPHP's event loop all day.

😑 Are you tired of managing loads of use (...) constructs because you need some local variable inside a deeply nested closure?

🤯 Use the following tiny function abusing Closure::bind() to bend variable scope to your will!

function run_scoped(Closure $callback, $init = [])

loilo

import revHash from 'rev-hash'
import { readFileSync, statSync } from 'fs'
import { resolve } from 'path'

/**
 * Calculate the rev hash for a file
 *
 * @param {string} file The path to the file to hash
 * @returns {string}
 */

loilo

Node Path Resolver

Implementation of the Node module resolution algorithm (aka require.resolve()) in PHP.

Depends on league/flysystem and illuminate/support.

Basic Usage

use League\Flysystem\Filesystem;
use League\Flysystem\Adapter\Local;

loilo

(An Approach to) Vue.js Template Variables

This has first been published as an article on dev.to.

The Problem

From time to time, I have the need to temporarily store the results of a method call in Vue templates. This is particularly common inside loops, where we cannot easily use computed properties.

Basically what we'd want to avoid is this:

<!-- List.vue -->

loilo

Structural Extraction of PHP Arrays

Extract structures from PHP arrays, kind of like an advanced pluck.

Signature

The provided xtract function takes a $source (usually an array) and a $target, which is the structure to transform the $source into:

mixed xtract( mixed $source, mixed $target )

Simple Examples