idibidiart

Testing in-browser gif generation from an SVG with gif.js. Works in recent Chrome/Safari/Firefox.

Process:

Create a standard SVG line chart.
Step through in-between frames of the line chart: for each one, update the SVG, render to an image, add the image element to a stack of gif frames.
Render frames together in the background using gif.js web workers.
When rendering's complete, add the blob URL as an image and start the SVG on an infinite loop with d3.timer (gratuitous).

Please go here for latest post and feel free to comment

[new post] (https://gist.github.com/idibidiart/49a095b6bc528638f34f)

There is not a lot of doc or posts about making an headless renderer with webgl support. Here are few of my findings

I tried things on Heroku, but I was not able to make anything work.

Next, I tried EC2 t2.micro, only to find out that OpenGL needs a graphic card to execute (sure, there are things like mesa that I didn't tried, but it looked like I needed to build Chrome and I didn't want to go that way).

The only easy solution that I found was AWS EC2 GPU Instances. They are pretty much overpriced for what I'm trying to acheive, but it worked. You need to use an AMI that support the Nvidia GRID thing. eg https://aws.amazon.com/marketplace/pp/B00FYCDDTE and its CentOS.

Slimer need Firefox and Firefox need shared libraries that we need to install (we will use a custom repo).

Unhandled Promise Rejections

Cause silent failure mode, with unlogged warning, on older version of Node Cause a crash on newer version of Node

I had already told some developers about it. Prakash avoided it in Power Reviews

In FromManufacturer.js

componentDidMount() {

1 client sending 10 requests

$ ab -c 1 -l -n 10 -H "Accept-Encoding: gzip,deflate" -w http://localhost:8081/webstore/search?q=bed

This is ApacheBench, Version 2.3 <$Revision: 1757674 $>
Copyright 1996 Adam Twiss, Zeus Technology Ltd, http://www.zeustech.net/
Licensed to The Apache Software Foundation, http://www.apache.org/

..done

This demo uses d3.layout.force() to calculate the node positions and then passes those to webGL to render them on the GPU.

	function rawAsap(task) {
	if (!queue.length) {
	requestFlush();
	flushing = true;
	}
	// Equivalent to push, but avoids a function call.
	queue[queue.length] = task;
	}

	var queue = [];

	<!doctype html>
	<html lang=en>
	<head>
	<meta charset=utf-8>
	<title>Copy To Clipboard Example</title>
	</head>
	<body>

	<input id="txtToCopy" type="text">
	<button id="btnCopy">Copy!</button>

	const fetch = (url) => {
	return new Promise((resolve, reject) => {
	setTimeout(() => {
	console.log(url)
	switch(url.match(/\d[aA-zZ]$/)[0]) {
	case "1a":
	resolve({name: "Seb"})
	// or try this instead:
	// reject({error: "something went wrong while fetching " + url})
	break;