<script src="http://use.typekit.com/daz7uli.js"></script>
<script>try{Typekit.load();}catch(e){}</script>

I noticed this bit of code on a respectable website but I can't figure out how or why they are using it?

I have never used Adobe TypeKit for loading websites before. I have only used Font Squirrel to generate fonts like so:

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 23, 2013 08:21:00 PM America/New_York */
@font-face {
font-family: 'ProclamateLight';
src: url('proclamate_light-webfont.eot');
src: url('proclamate_light-webfont.eot?#iefix') format('embedded-opentype'),
url('proclamate_light-webfont.woff') format('woff'),
url('proclamate_light-webfont.ttf') format('truetype'),
url('proclamate_light-webfont.svg#ProclamateLight') format('svg');
font-weight: normal;
font-style: normal;

}

However, is Adobe TypeKit a better solution than @font-face? Or is it even intended to replace @font-face CSS declarations?
Just trying to get a feel for what would work best and on all platforms, mobile browsers and outdated desktop browsers too.

Thanks,