live-server with hot reloading
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.gitignore no package lock Jan 19, 2018
LICENSE Initial commit Jul 16, 2016
README.md em dash Apr 24, 2018
index.js tidy Apr 20, 2018
package.json tidy Apr 20, 2018
ws-inject.html tidy Apr 20, 2018

README.md

hot-server

No config hot reloading for sketching with code.

Instructions

Install:

npm install -g hot-server

Serve directory statically:

hot-server

Save changes to *.js or *.css and they'll be injected via a websocket without a full refresh.

Since your whole script file reruns, you'll probably want to clean up anything it adds to the page with something like var svg = d3.select('#graph').html('').append('svg'). Stopping any timers and clearing any listeners that don't reset is also a good idea:

if (window.timer) timer.stop()
window.timer = d3.timer(function(t){
  // cool animation code
})

To persist data between refreshes, declare and initialize your data in a separate file from the rest of your code. Only the changed file will rerun. Or only initialize your data on the first run:

window.points = window.points || d3.range(50)
    .map(function(d){
      return [Math.random() * width, Math.random() * height]
    })

Default port is 3989; hot-server --port=4444 sets the port.

Is this the right tool for me?

If you're building an actual webapp, maybe not! This is a naive approach to hot reloading that will not work with more complicated code. Webpack might be a better option:

Or a even a different language:

But! If you're mostly working on short, simple pieces and dislike yak shaving config files this might be a good fit. It is as simple to use as python -m http.server with the added benefit of seemly magically updating pages without a refresh.

The implementation is also simple—just 50 lines of code for the server and 10 for the client—and you might be able to re-purpose it. I incorporated a modified version into a slow make/requirejs/grunt build system at work and reduced the time it took to see the result of changing my code from ~6 seconds to 0.