私のホームページは現在5つのWebフォントを使用しています。HelveticaNeueのサポートがまだらなので、6にしたいのですが。フォントの1つは 'FontAwesome'アイコンで、他の4つは1つか2つの単語にのみ使用されます（つまり、「古いコンピューターのように見える文字で書かれた "最適化"という見出しがあります）。
これらのフォントのうち2つはGoogleから入手でき、必要な文字だけを要求します（これは非常にうまく機能します）。ただし、他の2つはopenfontlibrary.orgからのものであり、単一の形式でのみ入手できます。これは大したことではありません（ローカルコピーの方が良いので、安全にそれらを必要とします）。
次に、ページの読み込み時間をテストします。私は自分のローカルコピーをサブセット化することが可能だと思いますが、この分野で誰もが経験がありますか？
回答:
非標準のWebフォントを使用すると、標準のWebセーフシステムフォントを使用する場合に比べて、ページの読み込み時間に大きな影響があります。これは、JavaScriptと@ font-faceのどちらを使用しているかに関係なく当てはまります。
非標準のWebフォントを使用する必要があるかどうかを常に注意深く分析する必要があります。
非標準のWebフォントの使用を検討する際に自問すべきいくつかの質問：
他の4つは1語か2語にのみ使用されます
それは文字通りのステートメントですか？
もしそうなら、なぜこれらのフォントをサブセットにせよ、せずに埋め込むのが面倒なのですか？この場合、最適化するべきではなく、単にを削除するだけです。必要なテキストの画像を作成し、お気に入りのテキスト置換手法を使用します。一言で言えば、サイトにHTTPリクエストとダウンロード時間を追加しています。
フォローアップのために、@ font-faceジェネレーターの詳細オプションを使用してフォントをサブセット化したので、必要な文字のみをロードしました。
オプションの1つは、フォントをBase64エンコードすることでした（これにより、CSSファイルにフォントを埋め込むことができました）。メモリが機能する場合、Base64は.woffおよび.ttfフォントをエンコードします。
私はできる限り多くのブラウザーのできるだけ多くのユーザーをサポートしたいが、余分な、おそらく冗長なデータを使用して最新のブラウザーのユーザーを遅くする価値はないと判断したので、Modernizr（yep / nope.jsを使用）を使用して強化された防弾フォントの文法CSSに従って、すべてのフォント形式への参照を含む個別のファイルを非同期にロードします。
.woffフォントをBase64でエンコードし、残りのフォント宣言をプライマリCSSファイルに含めるか、Base64でエンコード.woffしたものだけをプライマリCSSに含めてから、をCSS介して非同期にロードしたファイルに他の形式を含めますModernizr.load。
見た目よりも読み込み時間を優先したいので、FOUCは大きな懸念事項ではありませんでしたが、ほとんどのブラウザーは、（Base64でエンコードされたフォントCSSが読み込まれた後）非同期で読み込まれたときに、フォントに「リンク」されていることに注意します。
プラスの面では、フォントがロードされてキャッシュに保存されると（サーバーに設定された長い有効期限ヘッダー）、「点滅」がなくなり、フォントの拡張セットをロードして、他の言語を話すユーザーが（そして含まれているGoogle翻訳ウィジェット）には、スタイル化されたテキストが表示されます。
これは自分のサイトだったので、実験はできましたが、主に「誇示」するためにやっていました。クライアントサイトのほうが保守的です。
私が実装したもう1つの手法は.svg、@ font-faceジェネレーターが生成するように個別のファイルにフォントを置くのではなく、すべてのフォントを1つのファイルに入れ、それぞれを独自のIDで識別することでした。