Find out which HTTP requests your website triggers in the background and where they call out to

This is not my discovery, but a very useful resource found through a Florian Roth tweet:

[embed][/embed] is a service which analyses websites and the resources they request. Much like the Inspector of your browser, will let you take a look at the individual resources that are requested when a site is loaded.

The idea behind is to allow even inexperienced users to get a look at what a particular website is requesting in the background. For people new to modern web development, this will often have a certain wow-effect.

The tool was developed by Johannes Gilger, with this technology: uses server-side rendering, so any piece of JavaScript that is included definitely falls into the nice-to-havecategory.

  • Bootstrap As much as I like fiddling with CSS, I had to start somewhere
  • jQuery Because I’m an old-school kind of guy and because of Bootstrap
  • moment.js So I can render & cache results with static timestamps but display relative ones
  • livestamp.js Live-updating relative timestampscount
  • Up.js For the counting stats numbers (100% vanity)
  • Google Maps For maps, I’ve tried leaflet.js but wasn’t convinced (yet)
  • Google Analytics I realize that this will be blocked by a lot of users, but it’s just so easy to set up. We have fallback analytics.

The backend processor for this site was built with ♥ and the awesome Chrome Remote Debugging API.

If you want to know more about how it works and how everything fits together, invite me to a cool conference and I’ll give a talk about it ;)

I tried it with my site and the results were accurate and interesting:

Really useful the feature that allows the export of the report in JSON format:

So, take a look to this tool: