Skip to content

Instantly share code, notes, and snippets.

View thysultan's full-sized avatar

Sultan thysultan

165 followers · 48 following
View GitHub Profile
@thysultan
thysultan / index.html
Last active December 21, 2021 04:39
vdom creation #jsbench #jsperf (https://jsbench.github.io/#15f645ddcdb5540d0bca2cba5cafd1e4) #jsbench #jsperf
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>vdom creation #jsbench #jsperf</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
<script src="./suite.js"></script>
</head>
<body>
<h1>Open the console to view the results</h1>
@thysultan
thysultan / algorithmic-layouts.md
Created November 13, 2021 17:40 — forked from Heydon/algorithmic-layouts.md

Algorithmic layouts

You are looking at the most important, and most abundant thing on the web. You can't see it, unfortunately, because it's very small… aaaaand it's invisible — so having a magnifying glass doesn't really help here. But still.

I'm talking, of course, about U+0020; not to be confused with the band U2, who are just as ubiquitous, but far less useful.

This unicode point, representing the humble space character, is between every word, in every run of text, on every page of the web. And it has a very special characteristic: it's not sticky like glue. If two words are neighbors but there's not enough room for both of them, the space will free the second word to wrap around and start a new line.

Before getting into flexible containers, viewport meta tags, and @media breakpoints this humble character is what makes the web fundamentally 'responsive'. That is: able to change the layout of its content to suit different devices, contexts, and settings. Browser text does this automa

@thysultan
thysultan / Middleware.js
Last active April 11, 2020 14:54
stylis.js/pull/#203
import {MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION} from './Enum.js'
import {match, charat, substr, strlen, sizeof, replace, combine} from './Utility.js'
import {copy, tokenize} from './Tokenizer.js'
import {serialize} from './Serializer.js'
import {prefix} from './Prefixer.js'
/**
* @param {function[]} collection
* @return {function}
*/
@thysultan
thysultan / WebGL-frameworks-libraries.md
Created February 9, 2019 23:51 — forked from dmnsgn/WebGL-WebGPU-frameworks-libraries.md
A collection of WebGL frameworks and libraries

A non-exhaustive list of WebGL frameworks and libraries. It is mostly for learning purposes as some of the libraries listed are outdated/not maintained anymore.

Engines and libraries

  • three.js: JavaScript 3D library
  • stack.gl: an open software ecosystem for WebGL, built on top of browserify and npm.
  • PixiJS: Super fast HTML 5 2D rendering engine that uses webGL with canvas fallback
  • Pex: Pex is a javascript 3d library / engine allowing for seamless development between Plask and WebGL in the browser.
  • Babylon.js: a complete JavaScript framework for building 3D games with HTML 5 and WebGL
  • AwayJS: AwayJS is a graphics library for javascript written in typescript
  • SceneJS: An extensible WebGL-based engine for high-detail 3D visualisation
@thysultan
thysultan / v8.md
Created January 30, 2019 15:36 — forked from kevincennis/v8.md
V8 Installation and d8 shell usage

Installing V8 on a Mac

Prerequisites

  • Install Xcode (Avaliable on the Mac App Store)
  • Install Xcode Command Line Tools (Preferences > Downloads)
  • Install depot_tools
    • git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
    • sudo nano ~/.bash_profile
  • Add export PATH=/path/to/depot_tools:"$PATH" (it's important that depot_tools comes first here)
@thysultan
thysultan / gist:6941195937a3dcf7b123995d486ec51b
Created January 30, 2019 15:23 — forked from totherik/gist:3a4432f26eea1224ceeb
v8 --allow-natives-syntax RuntimeFunctions
Per https://code.google.com/p/v8/codesearch#v8/trunk/src/runtime.cc
%CreateSymbol
%CreatePrivateSymbol
%CreateGlobalPrivateSymbol
%NewSymbolWrapper
%SymbolDescription
%SymbolRegistry
%SymbolIsPrivate
@thysultan
thysultan / bench-instanceof-versus-typeof-megamorphic.js
Last active January 29, 2019 08:35 — forked from bmeurer/bench-instanceof-versus-typeof-megamorphic.js
Demonstrate the performance impact of using `instanceof` vs. checking for some existing property (in the megamorphic case)
// Copyright 2013-2019 Benedikt Meurer
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// <https://www.apache.org/licenses/LICENSE-2.0>
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
@thysultan
thysultan / refs.js
Last active December 14, 2018 22:44
Refs
// currentTarget is the current value i.e null/node while target is always the node the ref was attached to
// or vice-versa if matching event target/currentTarget sementics is of any merit.
function subscribe ({currentTarget, target, timeout = setInterval(() => {})}) {
assert(currentTarget instanceof Node || current === null)
assert(target instanceof Node)
// when a function is returned it is used when the ref is unmounted.
return () => setInterval(timeout)
}
@thysultan
thysultan / refs.js
Created December 14, 2018 22:15
// currentTarget is the current value i.e null/node while target is always node
function subscribe ({timeout = setTimeout(() => {}), target, currentTarget}, props, state, context) {
// when a function is returned it is used when the ref is unmounted.
return () => cleartimeout(returnValue)
}
@thysultan
thysultan / index.html
Created December 13, 2018 10:01
router
<script type="module">
import {h, render} from '//unpkg.com/dyo?module'
function handleLocation ({href} = location, {origin} = location) {
return href.replace(origin, '')
}
function handleClick (event, {href, children}, state, context) {
context.forceUpdate(history.pushState(event.preventDefault(), document.title = children, href))
}