東京Node学園祭2015
![フロントエンドに秩序を取り戻す方法 〜はてなブログ編集画面をリニューアルするためにやったこと〜 // Speaker Deck](https://cdn-ak-scissors.b.st-hatena.com/image/square/8aefb07e14f4a7d6cb46518d3432080874e51239/height=288;version=1;width=512/https%3A%2F%2Ffiles.speakerdeck.com%2Fpresentations%2F8175ffced95e4d1699c0e5f73357e8fd%2Fslide_0.jpg%3F5528044)
こんにちは、id:hakobe932です。はてなブログではユーザ体験の改善のために、ページ表示速度を向上させるための様々な取り組みを行っています。このエントリーでは、はてなブログで行っている、ブラウザキャッシュの活用、JavaScriptのページ最下部での読み込み、JavaScriptの圧縮、という3つの取り組みについて解説します。 ブラウザキャッシュの活用 同じ内容のJavaScriptやCSSを、ページを表示するたびにダウンロードすると、余分なHTTPリクエストが発生しますし、読み込み時間がかかります。 ブラウザのキャッシュを利用できれば、余分なリクエストを減らすことができます。はてなブログでは、なるべく長い間ブラウザにキャッシュを保存するために、JavaScriptなどの一部の種類のファイルのレスポンスに、以下のようなヘッダを指定しています。 $ curl -I http://hat
考えてみたら… はてな☆ログ:はてなスターを利用した足跡ログ取得サンプル - 風柳メモ で触れた、 はてなスターの認証強化について - はてなスター日記 の記事中の、 新しい仕様でも、JavaScriptが実行可能な環境で意図的にスクリプトを仕込むことで意図しない☆が付く動作を実行させることが可能ですが、はてなダイアリーやグループなどのJavaScriptを自由に書くことができない環境ではこのようなことはできなくなっています。 ですが……Google ガジェットを使ってしまうと、前提が崩れてしまうのでは。 てなわけで… こういうのが出来てしまいます。 とりあえず、サイドバーに設置して、様子見中…。 ■■■見たな?■■■ 設定方法 「はてなー☆来歴」のGoogle ガジェット追加「はてなー☆来歴」のGoogle ガジェット追加ページへ行く。 なお、はてなにログインしていると、上記ページに行っ
はてなブックマークのブックマーク数が多い順に記事を紹介する「はてなブックマーク数ランキング」。2024年2月のトップ50です*1。 順位 タイトル 1位 マンションリフォーム虎の巻 2位 死ぬほど嫌でした|佐藤秀峰 3位 「面倒なことはChatGPTにやらせよう」の全プロンプトを実行した配信のリンクを整理しました|カレーちゃん 4位 管理職必読 順番に読むと理解が深まる「マネジメントの名著」11冊 | 日経BOOKプラス 5位 メルカリで値段の「¥マーク」を小さくしたら購入率が伸びた理由、ペイディがサービス名を「カタカナ表記」にする理由など、プロダクトのマーケ施策まとめ30(2023)|アプリマーケティング研究所 6位 7年適当に自炊してきて調味料について思ったことを書く 7位 ウクライナ軍に入隊したアジャイルコーチが、さまざまなメソッドを駆使して中隊長としてのリーダーシップを実現した話(
解禁といってもえらい回り道をすれば間接的に、ですけど。 ■d2.hatena.ne.jpで新機能・新デザインのベータテストを開始しました - はてなダイアリー日記 ということで、ベータテスト中のはてなダイアリーを試している。 ファイルのアップロード機能が付いたのが物凄くでかい。 今のところ、一ファイル辺り100MまでOKで、あらゆる拡張子のファイルがアップロード可能。 ちょっと手間を掛けると色々な事ができるようになりそうです。 1.d2サーバーではファイルのアップロードが可能 2.拡張子を問わずどんなファイルタイプでもアップロードが可能 3.1ファイル辺り100MまでOK 4.htmlファイルやjavascriptファイルがアップロード可能 5.アップロードしたhtmlファイル内でjavascriptが無制限に動いている 6.popIn Rainbow等の外部ページをプレビュー出来るブログ
はてなスターのJSにExpiresヘッダ云々の件 Twitterでぼやいたらmala氏からレスがついたついでに。 以下の画像はlimilicのyslowの画面 s.hatena.ne.jpの画像やJavaScriptにはExpiresヘッダがありません サーバから送り出されるコンテンツにExpiresヘッダがあると、ブラウザは指定された時間までキャッシュし、ブラウザのリロードボタンを押したとき以外はIf-Modified-Sinceのリクエストも送りません。サーバにもクライアントにも優しくなれます ってことで、yslow対策(笑)だけではなく、はてなスターにもExpiresつけたらいいんじゃねと思っているのですが、難しいのはmala氏も指摘するHatenaStar.jsが外部からリンクされているため「ファイル名を変更しての強制Expires」ができない問題。Expireを設定するとブラウザ
1か月以上ご利用いただいていない日記の「スパムコメント・トラックバックの拒否」を有効にしました 先ほど、はてなダイアリーとはてなグループにおいて、1か月以上更新のない休眠状態のブログに対して「スパムコメント・トラックバックの拒否」設定をはてなにより有効とさせていただきました。 はてなダイアリー及びはてなグループにはコメントやトラックバックを外部から受け付ける機能があり、以前からご利用いただいております。しかしこの数ヶ月間、スパムコメントやトラックバックの数が非常に増加しており、日記一覧ページやアンテナで記事が更新されたと思って見に行ったらスパムコメントだけがついていたり、あるいは毎日のように大量のスパムトラックバックが飛んでくるため、いつもスパムへの誘導リンクを見てしまうといった被害が大量に発生しています。 はてなでは、先日からDNSBLを用いたトラックバックフィルターやコメント時の画像認
なんか予想より好意的に受け入れられてほっとした、HATENA-TUBEのテクニカルなお話。 みなさんHATENA-TUBEをajaxだと思ってますが、実は非同期通信なってまったくやってなかったりします。 サーバー言語 サーバーはPHP5で組んでます。 使ってるプロバイダは他にも Perl, ColdFusion,Rubyと選択肢が豊富だったのですが、PHP5。 なぜなら、ColdFusionはインストールして2時間、Perlは15分で挫折したからです。 コード書く前にどれだけ前提知識が必要なんだ!と問い詰めたい気分。PHP5は、Keitap先生がXMLのパースが楽と進めてくれたので採用。 ただ、シンタックスが「->」なのはキモくて困ります。 テンプレートエンジンにはSmartyというのを使いました。 使い方は本屋で、1万円使ってPHPの本3冊買って電車の中で覚えました。 データベース sq
本家 Text::Hatena で HTML::Parser を用いている部分は実装できていません。 URL の自動リンクや HTML のエスケープなどは実装できていません。 Cookie を利用するようなサイトに text-hatena.js を利用するのはお勧めできません。 ライセンスは Text::Hatena と同等とします。 技術的なアレコレ Perl と JavaScript って意外と似てるよね、というところから出発しました。特に、Text::Hatena のソースコードはそのまま JavaScript に置き換えられるぐらいに洗練されたコードです。例えば、Hatena.pm の一部に次のようなソースがあるのですが sub parse { my $self = shift; my $text = shift or return; $self->{context} = Text
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く