How do you determine the correct local font names when preloading webfonts?

How do you determine the correct local font names when preloading webfonts?

This article: When do web-fonts load and can you pre-load them?, says to
use local to take advantage of already loaded fonts. I can't find any
other way to preload webfonts.
However, I can't figure out what names I am supposed to use for the local
references. In MacOSX multiple variants show up as the same font name.
e.g. what i would think would be local("Helvetica Neue Light") is
available in font book as "Helvetica Neue"... how do i refer to different
variants?
@font-face {
font-family: 'ProximaNova';
font-weight: normal;
font-style: normal;
src: url('/fonts/proximanova/ProximaNova-Reg-webfont.eot');
src: local("Proxima Nova Regular"),
url('/fonts/proximanova/ProximaNova-Reg-webfont.eot?#iefix')
format('embedded-opentype'),
url('/fonts/proximanova/ProximaNova-Reg-webfont.woff') format('woff'),
url('/fonts/proximanova/ProximaNova-Reg-webfont.ttf')
format('truetype'),
url('/fonts/proximanova/ProximaNova-Reg-webfont.svg#webfont')
format('svg');
}
@font-face {
font-family: 'ProximaNova';
font-weight: $light_weight;
font-style: normal;
src: url('/fonts/proximanova/ProximaNova-Light-webfont.eot');
src: url('/fonts/proximanova/ProximaNova-Light-webfont.eot?#iefix')
format('embedded-opentype'),
url('/fonts/proximanova/ProximaNova-Light-webfont.woff')
format('woff'),
url('/fonts/proximanova/ProximaNova-Light-webfont.ttf')
format('truetype'),
url('/fonts/proximanova/ProximaNova-Light-webfont.svg#webfont')
format('svg');
}
All variations still result in requests for the woff files in chrome.
Additionally, I can't find any recent or current best practices on web
fonts or how to optimize their performance, how can I prevent these
requests?