Skip to content

Instantly share code, notes, and snippets.

View nestarz's full-sized avatar
🏠
Working from home

Elias Rhouzlane nestarz

🏠
Working from home
View GitHub Profile

Rendering Interactive HTML using Preact

It's possible to render HTML in Preact using the dangerouslySetInnerHTML prop, however doing so bypasses the Virtual DOM entirely. This may be reasonable for static HTML, but interactivity can be a little painful to graft on without VDOM.

There is another technique available that melds HTML to Virtual DOM without such limitations.

Enter DOMParser

@viclafouch
viclafouch / modal.jsx
Last active January 23, 2023 21:14
An implementation of a Modal Component with React Hooks ! See https://react-modal.viclafouch.vercel.app
import React, { useEffect, useImperativeHandle, useState, forwardRef, useCallback } from 'react'
import { createPortal } from 'react-dom'
import './styles.css'
const modalElement = document.getElementById('modal-root')
export function Modal({ children, fade = false, defaultOpened = false }, ref) {
const [isOpen, setIsOpen] = useState(defaultOpened)
const close = useCallback(() => setIsOpen(false), [])
@WorldMaker
WorldMaker / use-blurhash.ts
Last active June 15, 2023 11:26
useBlurhash hook
import { decode } from 'blurhash'
import { useEffect, useState } from 'react'
function useBlurhash (blurhash: string, width: number, height: number, punch: number = 1) {
punch = punch || 1
const [url, setUrl] = useState(null as string | null)
useEffect(() => {
let isCancelled = false
@jonikorpi
jonikorpi / css.js
Last active September 4, 2021 01:38
Single-file components in React, using Constructable Stylesheets
// https://github.com/calebdwilliams/construct-style-sheets
import "construct-style-sheets-polyfill";
export default strings => {
if (document.readyState === "loading") {
window.addEventListener("DOMContentLoaded", () => adopt(strings));
} else {
adopt(strings);
}
};
@FlorianRappl
FlorianRappl / useCarousel.ts
Last active March 27, 2024 13:58
The generic useCarousel hook.
import { useReducer, useEffect } from 'react';
import { useSwipeable, SwipeableHandlers, EventData } from 'react-swipeable';
function previous(length: number, current: number) {
return (current - 1 + length) % length;
}
function next(length: number, current: number) {
return (current + 1) % length;
}
@exAspArk
exAspArk / curl.sh
Last active May 28, 2024 06:43
Test CORS with cURL
curl -I -X OPTIONS \
-H "Origin: http://EXAMPLE.COM" \
-H 'Access-Control-Request-Method: GET' \
http://EXAMPLE.COM/SOMETHING 2>&1 | grep 'Access-Control-Allow-Origin'
@artcg
artcg / cuda2float.py
Last active August 29, 2018 11:10
Quick and dirty script to convert CUDA t7 files to CPU-friendly versions
def cuda2float(filename):
f = open(filename, 'rb')
s = f.read()
f.close()
CudaTensor = b''.fromhex('10000000746F7263682E 43756461 54656E736F72 '.replace(' ', ''))
FloatTensor = b''.fromhex('11000000746F7263682E 466C6F6174 54656E736F72 '.replace(' ', ''))
CudaStorage = b''.fromhex('11000000746F7263682E 43756461 53746F72616765'.replace(' ', ''))
FloatStorage= b''.fromhex('12000000746F7263682E 466C6F6174 53746F72616765'.replace(' ', ''))
cudnnSpatialBatchNorm = b''.fromhex('1F0000006375646E6E2E5370617469616C42617463684E6F726D616C697A6174696F6E')
nnSpatialBatchNorm = b''.fromhex('1C0000006E6E2E5370617469616C42617463684E6F726D616C697A6174696F6E')
@dmnsgn
dmnsgn / WebGL-WebGPU-frameworks-libraries.md
Last active July 25, 2024 07:43
A collection of WebGL and WebGPU frameworks and libraries

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

Engines and libraries ⚙️

Name Stars Last Commit Description
three.js ![GitHub
@koaning
koaning / tf.py
Created March 9, 2017 16:13
tensorflow layer example
import tensorflow as tf
import numpy as np
import uuid
x = tf.placeholder(shape=[None, 3], dtype=tf.float32)
nn = tf.layers.dense(x, 3, activation=tf.nn.sigmoid)
nn = tf.layers.dense(nn, 5, activation=tf.nn.sigmoid)
encoded = tf.layers.dense(nn, 2, activation=tf.nn.sigmoid)
nn = tf.layers.dense(encoded, 5, activation=tf.nn.sigmoid)
nn = tf.layers.dense(nn, 3, activation=tf.nn.sigmoid)