Here is a gist I have created just for this post – https://gist.github.com/tosbourn/4949176
Well, well, well! Looks like it is just some Document.Writes, those guys are pretty easy to work with, so lets copy the entire thing and paste it into a text editor.
Once in the text editor we need to run a find and replace on a three things;
- Find any reference of \n and remove it.
- Find any reference of \ and remove it.
- Find any double spaces and remove them.
Then just remove the
'); from the start and end of the two lines.
You are left with something like this;
<link href="https://gist.github.com/assets/embed-0af287a4b5c981db301049e56f06e5d3.css" media="screen" rel="stylesheet" /> <div id="gist4949176"><div><div><div><table cellpadding="0" cellspacing="0"><tr><td><span id="file-gistfile1-txt-L1" rel="file-gistfile1-txt-L1">1</span><span id="file-gistfile1-txt-L2" rel="file-gistfile1-txt-L2">2</span><span id="file-gistfile1-txt-L3" rel="file-gistfile1-txt-L3">3</span></td><td><pre><div id="file-gistfile1-txt-LC1">Here is my Gist!</div><div id="file-gistfile1-txt-LC2">Look at it!</div><div id="file-gistfile1-txt-LC3">Gisting all over the place</div></pre></td></tr></table></div></div><div><a href="https://gist.github.com/tosbourn/4949176/raw/678465ea9db744f03fa7628745942fae281d1123/gistfile1.txt" style="float:right">view raw</a><a href="https://gist.github.com/tosbourn/4949176#file-gistfile1-txt" style="float:right; margin-right:10px; color:#666;">gistfile1.txt</a><a href="https://gist.github.com/tosbourn/4949176">This Gist</a> brought to you by <a href="http://github.com">GitHub</a>.</div></div></div>
https://gist.github.com/assets/embed-0af287a4b5c981db301049e56f06e5d3.css and grab the CSS.
Now we simply replace the first line of our code from the
link element to a
style block and include the CSS, now all that is left is to copy and paste this code from our text editor into our website.
Here is the result sans external calls;
Here is my Gist!
Look at it!
Gisting all over the place
I think it works well and you can’t deny the performance benefits.
You can also make this process a bit smoother by requesting the .json or .txt versions of the Gist, in our example change .js to either .json or .txt, like so: https://gist.github.com/tosbourn/4949176.txt
Thanks so much to PunKeel for suggesting the .json or .txt variants.