Inline expansion, or inlining, generally refers to merging two different pieces of source code into a single location for performance. A much less common technique is called outlining, where a single piece of source code is split into multiple pieces. Vanilla Plus JS will extract any script or style tags within your HTML files and move them into their own file automatically. Furthermore, any SVGs which are included in your CSS files will be extracted into their own file automatically. Hence, Vanilla Plus JS will outline CSS, JS, and SVG files.
Although there is an argument this could improve average performance when combined with the cache strategy discussed earlier, that is not the primary reason for this outlining.
A Content Security Policy, or CSP, is a modern technique to mitigate many common threats to web applications. Though the developer cannot ignore these threats altogether, a strong CSP lowers the threat surface and thus how much the developer needs to be concerned about. A good basis for such a CSP is:
Content-Security-Policy: default-src 'self'; object-src 'none';This essentially states that the browser should not connect to any other websites than the one serving the HTML file, and should not run any scripts or images unless the server explicitly marks them as such. Furthermore, it prevents the use of <object>, <embed>, and <applet> elements. This means that, short of writing scripts that are served directly by your static web server with an executable MIME type, which is a very unlikely scenario, the only scripts that will run on the browser are those you wrote: preventing cross-site scripting even if you would have otherwise been vulnerable.
One of the most important parts of a CSP is preventing inline scripts, followed by inline styles and inline SVGs. That is because these are the most straight-forward ways to exploit unsanitized user input being displayed on the browser: a common mistake which often goes unnoticed. However, without additional tooling, this can lead to a worse developer experience, as it is often convenient to use inline styles and scripts for one-off behavior or for prototyping. Furthermore, these are often provided in online examples or the documentation for how to integrate libraries (most commonly analytics libraries). Even more difficult to manage, minified CSS files typically have SVGs inlined to make distribution simpler.
Fortunately, with Vanilla Plus JS you can still use a strong CSP without changing your use of inline scripts and styles, as it will automatically extract them into their own files and replace the original inline tags with a link to the extracted file.