Navigation Timing, Headless Chrome, Docker

Dockerfile

FROM node:8.7.0-slim

RUN apt-get update && \
  apt-get install -yq gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 \
  libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 \
  libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 \
  libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 \
  ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget

RUN npm i puppeteer micro qs

RUN echo "\
const { parse } = require('qs')\n\
const { send } = require('micro')\n\
const puppeteer = require('puppeteer')\n\

module.exports = async (req, res) => {\n\
  async function timings (url)  {\n\
    const browser = await puppeteer.launch({\n\
      // ommmmm\n\
      args: ['--disable-setuid-sandbox', '--no-sandbox']\n\
    })\n\
    const page = await browser.newPage()\n\
    await page.goto(url)\n\
    const t = await page.evaluate(() => {\n\
      return window.performance.timing\n\
    })\n\
    await browser.close()\n\
    return t\n\
  }\n\

  let url = req.url\n\
  const index = url.indexOf('?')\n\

  if (index !== -1) {\n\
    url = url.substr(index + 1)\n\
  }\n\

  const query = parse(url)\n\
  const t = await timings(query.url)\n\
  return t\n\
}\n\
" > index.js

CMD ["node_modules/.bin/micro", "index.js"]

Navigation Timing

Identify where your application is spending its time Live Demo

# build
docker build -t [image_name] .
# run
docker run -d --name [container_name] [image_name]

If you send a GET request to e.g. /?url=https://daliborgogic.com you will get back an object:

{
  "navigationStart": 1508774410579,
  "unloadEventStart": 0,
  "unloadEventEnd": 0,
  "redirectStart": 0,
  "redirectEnd": 0,
  "fetchStart": 1508774410580,
  "domainLookupStart": 1508774410581,
  "domainLookupEnd": 1508774410596,
  "connectStart": 1508774410596,
  "connectEnd": 1508774410852,
  "secureConnectionStart": 1508774410712,
  "requestStart": 1508774410852,
  "responseStart": 1508774411015,
  "responseEnd": 1508774411131,
  "domLoading": 1508774411024,
  "domInteractive": 1508774411837,
  "domContentLoadedEventStart": 1508774411837,
  "domContentLoadedEventEnd": 1508774411839,
  "domComplete": 1508774413498,
  "loadEventStart": 1508774413498,
  "loadEventEnd": 1508774413502
}

Total time from start to load: loadEventEnd - fetchStart
Time spent constructing the DOM tree: domComplete - domInteractive
Time consumed preparing the new page: fetchStart - navigationStart
Time spent during redirection: redirectEnd - redirectStart
AppCache time: unloadEventEnd - unloadEventStart
Time spent unloading documents: domainLookupStart - fetchStart
DNS query time: domainLookupEnd - domainLookupStart
TCP connection time: connectEnd - connectStart
Time spent during the request: responseEnd - requestStart
Request to completion of the DOM loading: domInteractive - responseEnd
Load event time: loadEventEnd - loadEventStart
Render Time: domComplete - domLoading

I really like this project, it's exactly what I need. But somehow I'm only getting empty responses

Run from the server (outside the container:)

curl http://127.0.0.1:32768/?url=https://daliborgogic.com
{}

The container is running at 0.0.0.0:32768->3000/tcp

Do you have some tips to make this running?