Simon Willison’s Weblog

534 items tagged “javascript”

Everyone can now run JavaScript on Cloudflare with Workers. This is such a brilliant piece of software design: Cloudflare took the service workers spec and used it as the basis for their edge-executed JacaScript feature. This means you can run server-side JavaScript in hundreds of edge locations worldwide, applying custom dynamic logic (including additional async cached fetch() calls) with only around 1ms if additional overhead. The pricing model is a steal: $0.50 per million requests with a $5/month minimum. # 13th March 2018, 4:36 pm

Being fast and light: Using binary data to optimise libraries on the client and the server. (via) Ada Rose Cannon provides a detailed introduction to ArrayBuffers in JavaScript and describes how she used them for a custom binary protocol to sync the state of 170 Virtual Reality users in the same venue without bringing down the network. # 13th March 2018, 2:34 pm

owlsnearme source code on GitHub. Here’s the source code for our new project. It’s a single-page React application that pulls all of its data from the iNaturalist API. We built it this weekend with the SuperbOwl kick-off as a hard deadline so it’s not the most beautiful React code, but it’s a nice demonstration of how React (and create-react-app in particular) can be used for rapid development. # 4th February 2018, 10:33 pm

Observable: An Earthquake Globe in Ten Minutes. Well worth your time. Jeremy Ashkenas uses Observable to live-code an interactive visualization of recent earthquakes around the world, using USGS data (fetched as JSON), d3, topoJSON and an Observable notebook. I’m sold—this is truly ground-breaking new technology. # 31st January 2018, 5:01 pm

Observable Beta (via) Observable just released their beta, and it’s quite something. It’s by Mike Bostock (d3), Jeremy Ashkenas (Backbone, CoffeeScript) and Tom MacWright (Mapbox Studio). The easiest way to describe it is Jupyter notebooks for JavaScript supporting reactive programming—so code is evaluated as you type and you can add interactive widgets (like sliders and canvas views) to construct explorable visualizations on the fly. # 31st January 2018, 4:46 pm

Frontend in 2017: The important parts. Keeping track of developments in the frontend and JavaScript community is pretty much a full time job here days, so I found this summary of trends and developments over 2017 very useful for trying to catch up. # 29th December 2017, 8:30 am

The State of JavaScript 2017: Front-end Frameworks. This year’s State of JavaScript survey results are out. As usual, the “I’ve USED it before, and would NOT use it again” answers are some of the most thought-provoking. Angular, Meteor, Backbone, Grunt, Gulp, Bootstrap and Cordova aren’t scoring well in that regard. # 13th December 2017, 6 pm

deeplearn.js imagenet webcam demo (via) This is pretty astonishing... deeplearn.js is a Google Brain research tool that implements a GPU-accelerated neural network in browser-friendly JavaScript (using WebGL fragment shaders to run the algorithms). This demo hooks into your webcam and runs the SqueezeNet image recognition model against it, showing classification in real-time and providing a live-updating visualization of the different layers of the network. # 5th December 2017, 11:15 pm

Object models (via) Extremely comprehensive and readable discussion of the object models of Python, JavaScript, Lua and Perl 5. I learned something new about every one of those languages. # 29th November 2017, 2:59 pm

Firefox Debugger Playground. Excellent hands-on tutorial to using the Firefox JavaScript debugger. I learned a bunch of neat tricks from this—including using conditional breakpoints to add temporary console.log statements—since that function returns undefined it won’t pause your code, but this saves you from having to remember to remove the lines from your source code later. I also didn’t know that the Firefox debugger can show the value of variables in paused code if you hover over them in the source pane. [UPDATE: Turns out Chrome DevTools do this as well—TIL] # 28th November 2017, 4:01 pm

VoxelSpace (via) Lovely clear explanation of the voxel space landscape rendering technique used by NovaLogic for Comanche back in 1992, including a working JavaScript demo plus pseudo-code in Python. # 24th November 2017, 7:30 pm

JOY.js (via) Delightful new exploratory programming environment from Nicky Case. Try the Turtle demo, which takes Logo and updates it for the modern web. # 21st November 2017, 2:50 pm

Can You Afford It?: Real-world Web Performance Budgets. Alex Russell’s magnum opus on web performance budgets in 2017. He proposes a baseline testing device equivalent to a $200 Android phone on a slow 3G network emulated at 400ms RTT/400Kbps transfer and encourages a goal of 5s time-to-interactive on first load and 2s TTI for subsequent views. This means around 130kb of gzipped JavaScript—challenging but not impossible with modern JavaScript frameworks. # 23rd October 2017, 1:51 pm

SurviveJS—Webpack (via) Free online book about Webpack. I’ve read the first couple of chapters and it looks like a concise, well constructed guide to a key component of the modern JavaScript stack. # 22nd October 2017, 1:22 pm

Carbon (via) Beautiful little tool that you can paste source code into to generate an image of that code with syntax highlighting applied, ready to be tweeted or shared anywhere that lets you share an image. Built in Node and next.js, with image generation handled client-side by the dom-to-image JavaScript library which loads HTML into a SVG foreignObject (sadly not yet supported by Safari) and uses that to populate a canvas and produce a PNG. # 19th October 2017, 6:31 pm

Are traditional web frameworks and languages like RubyOnRail, Spring Boot and PHP dying now when new fast reactive pure JavaScript frameworks and services like Meteor, Node, Angular 2.0 and Firebase are breaking ground?


[... 40 words]

How does one decide which Javascript framework (e.g. Node, Backbone, Angular) to use on any given project?

If you are just learning JavaScript, I suggest trying to work without any frameworks or libraries at all. Starting with something like Angular will make it much harder for you to learn the core language and browser APIs.

[... 137 words]

In simple terms, what is node.js?

It’s server-side programming, like PHP. The language you write the server-side code in is JavaScript (specifically the JavaScript version supported by Google’s V8 JavaScript engine, which was originally written for the Chrome web browser).

[... 46 words]

What is the most succinct definition of a JavaScript callback, being more elaborative than simply “A function that calls another function.”?

A way of saying “once you’ve finished doing this, do that”.

[... 38 words]

What are the conference/meet-ups on JavaScript that accept guest speakers?

We have a crowdsourced list of JavaScript events that are accepting speaker submissions here: JavaScript conference calls for participation

[... 53 words]

Should a beginner to web development start out with Node.Js?

Maybe. One of the things I like about Node.js is that the raw abstraction it provides over HTTP is much closer to how the actual protocol works than the abstractions provided many of the more widely used frameworks such as PHP, Django or Rails. That might actually make it an effective learning tool—I’d be interested in hearing from some web developers who learnt Node.js as their first server-side technology.

[... 87 words]

How can you run image processing in cloud code (Parse) ? If parse is not the best

There are dozens of web-based image resizing APIs that could help with this. Check out for example.

[... 42 words]

Is there any alternative to or in Europe? are running a similar program in the Old Street area of London.

[... 30 words]

Beginner JavaScript: more code or quality code?

Write more code. The more code you have written, the better you’ll be able to understand why certain techniques for creating higher quality code are worthwhile later on.

[... 70 words]

How do I choose between asynchronous web frameworks? My tech group is fairly language agnostic and we’re trying to standardize on some technologies.

Since they are all pretty close to each other and it sounds like your tech group’s skills would support any of them, I would suggest having your tram build a simple prototype in all three so you can compare them for your own particular team and situation.

[... 76 words]

What are some JavaScript concepts that took you the longest to understand?

Closures, prototype inheritance, and the “this” keyword.

[... 60 words]

What are the design mistakes in the Meteor framework?

Treating the non-JavaScript case as unimportant.

[... 21 words]

How does a web page interact with a server to parse a dynamic JSON file?

If you’re only dealing with 60 records there’s no need to add a full database. I’ve actually hand coded a 50 record JSON file before and it was fine- use an editor with good JSON support (I like Sublime Text 2) and it’s pretty easy to hand write.

[... 103 words]

How do I get started with node.js?

You don’t run Node.js in a script tag on your website. Node is a technology for writing servers in JavaScript—you can think of it as a replacement/alternative for PHP, Python, Ruby, ASP.NET etc.

[... 58 words]

What are the strategies for a front end developer to keep up to date with the emerging technologies?

Step one: find developers who you respect and subscribe to their blogs, follow them on Twitter/Google+/etc and try to understand what they are talking about and what they think is exciting.

[... 139 words]