nick's blog

nick's blog

Sign in Subscribe

JS code-splitting with ES modules in the browser

javascript Featured

JS code-splitting with ES modules in the browser

Recently the New York Times shipped an interactive [https://www.nytimes.com/interactive/2018/upshot/elections-poll-ky06-1.html] built with native JavaScript ES modules, using Rollup.js instead of Webpack to provide a 25% reduction in JS shipped. This was really interesting to me as they used code-splitting with ES module

JS things I never knew existed

javascript Featured

JS things I never knew existed

I was reading through the MDN docs the other day and found these JS features and APIs I never knew existed. So here is a short list of those things, useful or not - learning JS seemingly never ends. Label Statements [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/

Transforming Async, Await JS and minifying using Uglify

Async and Await makes asynchronous code so much cleaner and nicer to work with. It is widely supported by all the latest versions of modern browsers, including Node v7.6+. See can i use [https://caniuse.com/#search=await] for browser support and node.green [http://node.green/#ES2017-features-async-functions] for

Using Workbox + Webpack to precache with Service Worker

webpack Featured

Using Workbox + Webpack to precache with Service Worker

Workbox [https://github.com/GoogleChrome/workbox] is a new project from Google that makes service worker use-cases such as caching, background sync and queueing of analytics whilst offline easier to code. > "Workbox is a rethink [on] our previous service worker libraries and tools, sw-toolbox and sw-precache, and is designed to

Debugging WebSockets using JS Proxy Object

Debugging WebSocket [https://developer.mozilla.org/en/docs/Web/API/WebSocket] connections with JS Proxy [https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Proxy] object is easy and requires surprisingly little code. Proxies allow you to set "traps" which can listen for new operator calls ("construct"), function

Using Rollup.JS to create JS modules

Using Rollup.JS to create JS modules and libraries is easy, it can easily output AMD, CJS, ES, IIFE and UMD JS formats with minimal configuration. Its plugin structure really nice too, you should find nearly anything you need here [https://github.com/rollup/rollup/wiki/Plugins]. This post will

Create your own custom RetroPie image

Create your own custom RetroPie image

Building your own custom RetroPie [https://retropie.org.uk/] image can be really slow, so I created a simpler way to do it using Docker and bash scripts - introducing docker-build-retropie-image [https://github.com/skyllo/docker-build-retropie-image]! Why Creating custom prebuilt images was becoming painful. I would burn the base RetroPie

Record to an Audio File using HTML5 and JS

Record to an Audio File using HTML5 and JS

Pure Native HTML5 Audio Recording is here and has been for a while, no more flash needed! Don't get too excited though, it still requires a bit of work to support it in a consistent manner. This post will focus on getting the recorded audio into the same file format

Reduce your JS payload when using polyfills in Babel

Are you importing the babel polyfill [https://babeljs.io/docs/usage/polyfill/] like... import 'babel-polyfill'; But only need the odd function like Object.values [https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Object/values] from ES2017? Then maybe you can reduce the size of your JS bundle

Elasticsearch - Extract logstash logs

So you have sent all your logs from logstash to your elasticsearch instance, now they are stored safely and with Kibana on-top to query, filter and visualise them beautifully. This post is about how to get your logs back from elasticsearch! Export Examples Export all logs, no filter or query

Kibana 4 - Import and Export Visualizations and Dashboards with Elasticdump

Kibana 4.0.0 does not allow you to save and load JSON visualizations and dashboards through its interface, Kibana 3 had an option to do this. This missing feature [https://github.com/elasticsearch/kibana/issues/1552] is planned to be part of the Kibana 4.1.0 release. Luckily

My First Ever Program

Sometime in the '90s I started to learn to program with BASIC [https://en.wikipedia.org/wiki/BASIC] on a VTech [https://en.wikipedia.org/wiki/VTech] laptop. I quickly got bored of all the other games on it and started an obsession with trying to program with it instead.

Initial Commit

And hopefully the first of many. I'm no writer but I really love to read about new technologies, hardware and programming. So my future posts will no doubt be about exactly the same topics! Starting from when I first learned how to program to now. Now here is a photo