Multi-size style refresh


I started looking a easy way to test multiple resolution tests. So my current solution.

  1. Nodejs server Running a simple websocket server
  2. Start-Stop server bash script
  3. A refresher page. Used when opened to broadcast a major refresh signal.
  4. Custom sublime builder command
  5. A simple snippet for the current page that's under development

1 - Server Must be visible to all browsers + Editor machine

"use strict";
// used for start-stop script
process.title = 'nodejscurrent';

var app = require('http').createServer(handler), io = require('').listen(app), fs = require('fs');


function handler (req, res) { fs.readFile(__dirname + '/index.html', function (err, data) { if (err) { res.writeHead(500); return res.end('Error loading index.html'); }


}); }

io.sockets.on('connection', function (socket) { socket.on('do-refresh', function (data) { socket.broadcast.emit('refresh'); });

io.sockets.on('message', function(data) {
    console.log("MSG", data);


  1. Start-Stop bash script
ps aux | grep nodejsrefresher | awk '{ system("kill -9 "$2)}'; nodejs server.js
  1. The refresher page. Must be visible for the sublime-editor

    <!-- REFRESHER -->

  1. Custom sublime builder command
    • Create from Tools -> Build System -> New Build System

"shell_cmd": "google-chrome http://REFRESHER-VISIBLE-URL/refresh.html"

  1. A simple snippet for the current page that's under development Add in head section. Put the client for example in 'static' folder.

Maybe not a perfect solution but works really good for many browser windows + devices. Added in chrome "responsiView" plugin for testing standard resolutions.