Andrea Giammarchi WebReflection

How to file a GitHub/Lab issue

Filing an issue is not about delegating your problem to another developer, it’s about helping maintainers solve issues they haven’t encountered yet.

This is an alternative to the Modern Script Loading tchnique, that doesn't need to wait for the load event.

Compatibility

This technique has been successfully tested down to IE9.

<!DOCTYPE html>
<html lang="en">

This gist contains few scripts I use daily to help myself work with git for both personal projects and work.

GNOME

My GNOME tips are here https://gist.github.com/WebReflection/7538865e739c0c2eeb542dfac235e84c

./find

This utility finds outer dependent modules. I've used it on the top most folder with all cloned repo.

This list shows the most basic view with a counter in various libarries and patterns.

Why I use web components

This is some sort of answer to recent posts regarding Web Components, where more than a few misconceptions were delivered as fact.

Let's start by defining what we are talking about.

The Web Components Umbrella

As you can read in the dedicated GitHub page, Web Components is a group of features, where each feature works already by itself, and it doesn't need other features of the group to be already usable, or useful.

Handy Custom Elements' Patterns

^{Photo by Ricardo Gomez Angel on Unsplash}

This gist is a collection of common patterns I've personally used here and there with Custom Elements.

These patterns are all basic suggestions that could be improved, enriched, readapted, accordingly with your needs.

Random Wallpapers is awesome, but it also keeps changing wallpapers (which is what I like about it).

This is a collection of wallpapers I liked the most, specially suitable for dark theme mode.

^{Photo by Jonatan Pie on Unsplash}

Update

If you're OK in having a node-esm executable, please consider this solution.

#!/usr/bin/env sh
# the /usr/local/bin/node-esm executable
input_file=$1
shift
exec node --input-type=module - $@ &lt;$input_file

Bytecode And Web

Coming from this tweet: https://twitter.com/mathias/status/1115525813670227968

Similar way scripts with type module has been introduced, script with type bytecode and a specific engine target, including wasm, could make it too, so that engines able to digest pre-optimized code can benefit from this.

<script type="bytecode" engine="v8" src="v8.bc"></script>
<script type="bytecode" engine="spidermonkey" src="sm.bc"></script>
<script type="bytecode" engine="jsc" src="jsc.bc"></script>

	const env = {
	m1: `import {func} from './m2.mjs'; console.log(func());`,
	m2: `export function func() { return 'abc'; }`
	};

	const inlineModule = (env, text) => `data:text/javascript;base64,${
	btoa(inlineModules(env, text))
	}`;

	const inlineModules = (env, text) => text.replace(