タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

JavaScriptとperformanceとBlogに関するraimon49のブックマーク (4)

  • 惜しまれながら終了した、はてなグループの日記を静的サイトとして生成するジェネレータを GatsbyJS で作った - 2nd life (移転しました)

    はてなグループが終了してしまい、はてなに頼んでエクスポートしてもらった MovableType 形式の日記が記載されている .mt データは手元にあれど、手元のストレージの肥やしになっている方はいませんか、私はそうでした。 というわけで、せっかく10年以上書いていた日記がWeb上から消えてしまって悲しいので、もう一度再び公開できるように静的サイトジェネレータを作った。 https://subtech-secondlife.netlify.com/ (サブテク日記再び・懐かしのデザイン…) https://github.com/hotchpotch/hatena-group-static-generator (ソースコード) これを使えばみなさんはてなグループ日記をまたどこかに公開できるので、よかったら公開しよう!!1 GatsbyJS を使って作った感想 静的サイトジェネレータは一昔前は

    惜しまれながら終了した、はてなグループの日記を静的サイトとして生成するジェネレータを GatsbyJS で作った - 2nd life (移転しました)
  • はてなブログにおけるページ表示速度改善の取り組みについて - Hatena Developer Blog

    こんにちは、id:hakobe932です。はてなブログではユーザ体験の改善のために、ページ表示速度を向上させるための様々な取り組みを行っています。このエントリーでは、はてなブログで行っている、ブラウザキャッシュの活用、JavaScriptのページ最下部での読み込み、JavaScriptの圧縮、という3つの取り組みについて解説します。 ブラウザキャッシュの活用 同じ内容のJavaScriptCSSを、ページを表示するたびにダウンロードすると、余分なHTTPリクエストが発生しますし、読み込み時間がかかります。 ブラウザのキャッシュを利用できれば、余分なリクエストを減らすことができます。はてなブログでは、なるべく長い間ブラウザにキャッシュを保存するために、JavaScriptなどの一部の種類のファイルのレスポンスに、以下のようなヘッダを指定しています。 $ curl -I http://hat

    はてなブログにおけるページ表示速度改善の取り組みについて - Hatena Developer Blog
    raimon49
    raimon49 2014/03/14
    JavaScriptファイルをデプロイ時minifyして配信することがコストに対して恩恵が余り無いから使ってません、という話。パラメータにバージョン番号じゃなくてコミットハッシュ使ってる点もデプロイ回数の多さを物語ってる
  • 【翻訳】ソーシャルボタンはお友達さ! - MOL

    ども、実兄からFacebook友達申請きて承認を見送るt32kです。そんなソーシャル時代ですけどみなさんいかがお過ごしか?みなさんはこうは思わないだろうか?いいね!ボタンなどのソーシャルボタンはいっぱいあるけど、どうゆうふうに実装すればいいのよ!スニペット、コピペでいいの?ってね。そんなこと考えていたら、いい記事があったので翻訳してみたよの巻。 Original:Social button BFFs(2011-09-27)by Stoyan Stefanov TL;DR:JavaScriptの非同期読み込みはWebアプリのパフォーマンスにおいて重要な問題だ。以降に書かれている内容は一般的なソーシャルボタンに共通する取り扱い方についての記事であり、ソーシャルボタンに残りのコンテンツ読み込みをブロックさせないことを学べるだろう。結局のところ、ユーザーはあなたの コンテンツを最初 に見たいのであ

    【翻訳】ソーシャルボタンはお友達さ! - MOL
    raimon49
    raimon49 2012/08/07
    typeやasyncの属性指定は冗長。共通化するところまで。
  • 遅いブログパーツを高速表示する方法

    ブログパーツの表示が遅いと、ページ全体の描画が止まってしまいますよね。 ブログパーツを「非同期化」してしまえば、ストレス無くページが表示されるようになりますよ。 非同期化とは、ページの一部分を、全体のページから独立して描画させる方法です。 方法はいろいろあるのですが、今回はJavascriptの「setTimeout()」関数を利用しました。 setTimeout()は、メインの描画とは別に、指定した時間後に命令を実行する関数です。時間を0にすれば、非同期で動作させることが可能です。 ブログパーツは、主に3つの形に分けることができます。各々の形ごとに、高速化する方法を紹介します。 ●タイプ0 <iframe src=”http://hogehoge.com/blogparts.cgi”></iframe> iFrameのタイプは、すでに非同期化されているため、特に対策は必要ありません。 ●

    遅いブログパーツを高速表示する方法
  • 1