SPOFCheck

Fighting Frontend SPOF at its root

With the increase in 3rd party widgets and modernization of web applications, Frontend Single Point Of Failure
(SPOF) has
become a critical focus point. Thanks to Steve Souders for his
initial research
on this topic, we now have a list of common patterns which cause SPOF. The awareness of Frontend SPOF has also increased
tremendously among engineers, thanks to some of the recent blogs and articles
emphasizing the importance of it.

There are already a bunch of utilities and plugins out there which can detect possible SPOF vulnerabilities in a web application.
The most notable ones being webpagetest.org,
SPOF-O-Matic chrome
plugin and YSlow 3PO extension. At eBay we wanted to detect SPOF at a very early stage, during
the development cycle itself. This means an additional hook in our automated testing pipeline. The solution resulted in
creating a simple tool which works on our test URLs and produces SPOF alerts. The tool is SPOFCheck.

SPOFCheck is a Command Line Interface (CLI) built in Node.js to detect
possible Frontend SPOF for web pages. The output is generated in an XML format
that can be consumed and reported by CI jobs. The tool is integrated
with our secondary jobs, which run daily automation on a testing server where a development branch is deployed. In case of
a SPOF alert, engineers are notified and they act on it accordingly. This process ensures that SPOFs are contained within
the development cycle and do not sneak into staging or production.

Rules

SPOFCheck by default runs with 5 rules (checks). The rules are maintained in the rules.js
file. New rules can be easily added by pushing entries to the rules
array or calling the spof api registerRules. The
default rules come from Souders's original list outlined below

application-js - Load application JS in a non-blocking pattern or towards the end of page

fontface-stylesheet - Try to inline @font-face style. Also make the font files compressed and cacheable

fontface-inline - Make sure the fonts files are compressed, cached and small in size

fontface-inline-precede-script-IE - Make sure inlined @font-face is not preceded by a SCRIPT tag, causes SPOF in IE

Output

SPOFCheck creates a file and writes results in one of the below formats

junit-xml - a format most CI servers can parse, the default format

spof-xml - an XML format that can be consumed by other utilities

text - a textual representation of the results

The format can be specified using the --format or -f option. For just printing results i.e. no file creation, use the
--print or -p option

Testing

Currently tests are written for the Command Line Interface as a whole and not individual modules. The main test file is spofcheck.js
and uses the default Node.js assert module. To run the tests - clone the repo,
install the package $ npm install and run