pjaxできれいなURL＋非同期画面遷移！ | ヘッドウォータースのブログ TechNote
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね！ これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり！！SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました！！！ これからWebサービスを作るなら、導入したいですね！！！ これpjaxを使えば簡単に導入できるんです！！！よし！！！ PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
独学でコーディング！ - a-newcomer.com
ここ数年、会社を辞めて自分のペースで仕事を請け負うフリーランスという形態で仕事をする人が増えています。フリーランスには様々な職業があり、代表的なものでは翻訳業やイラストレーター、YouTuberもフリーランスに分類されます。そして代表的なフリーランスの職業がもう一つあります。それはプログラマー/エンジニアです。そのプログラミングの大部分を占める工程がコーディングであり、知識と技術を身につければ、憧れのフリーランスに鞍替えすることも夢ではありません。 それではコーディングの知識と技術を取得するにはどのようなルートがあるのでしょうか？現実として学校に通うか、プログラミングを請け負う会社に入社するか、あるいは独学で取得するかのいずれかを選択することになります。そこで今回は最も費用の少ない独学でコーディングを学ぶ方法を紹介したいと思います。 独学でコーディングの知識と技術を身につけるには まずはプ
本当はそれなりに面倒くさいJavaScriptとhistoryとAjaxのお話 - 愛と勇気と缶ビール
口上 historyとAjaxといえば、JavaScriptからある程度任意でhistoryのエントリをpushできるhistory.pushStateとか、history.replaceStateは既に大分有名になった感がある。 素晴らしい未来では、全てのブラウザにpushStateが乗っていて「location.hashを使ったAjax遷移が許されるのは10年前のブラウザまでだよねー」というハッピーな世界が実現するのだろう。が、今現在ではまだpushStateに対応していないブラウザのシェアも多く、Ajaxによる擬似画面遷移をモリモリ行うようなサイトではpushStateのある環境、ない環境の両方を考慮してやる必要がある。 (ちなみに、要件によっては「pushStateがないブラウザは通常の遷移で我慢しろ！」という割り切りも全然ありだと思う) 先に言っておくと、この記事は長いです。 環
YouTube連続再生をpushStateでパーマリンク化＆戻る対応した。 - 車輪を再発明 / koba04の日記
以前に作ったものは、検索文字列の取得、検索、動画再生をajax的に全てJavaScriptで行っていたので、当然パーマリンクはなく戻るボタンなどで前の検索履歴に戻ることが出来ません。 http://d.hatena.ne.jp/koba04/20110227/1298736386 その対応としてlocation.hashを使った方法などもあるのですが、HTML5ではhistoryオブジェクトのpushStateなどを使ってその辺りをうまく処理することが出来るので今回はそちらを採用しました。 githubで採用されているズババババッっていう感じのカッコいいやつですね。 ChromeとSafariでは確認しましたがその他ブラウザでは動かないかもしれません。 詳しくはWEB+DB PRESS vol.61のYappoさんの連載がわかりやすいので見てください。今回実装したのもほとんど真似させてもら
pjax こそが pushState + Ajax の本命 - punitan (a.k.a. punytan) のメモ
pjaxの前にpushStateとは AjaxとjQueryの説明は不要として、pushStateとはなんぞや。 pushStateを使ってブラウザの履歴に対する操作をし、HTMLの一部のみを書き換える動作でもブラウザの戻る／進む機能を実現できる方法のひとつ。Ajaxなページを再現し、かつURLを見慣れた方法で自然にpermalinkを表現できる。 有名なところではGitHubで使われてるアレ。 hash fragment (/#!/) ブラウザの履歴を機能させるため、URL の fragment (#) を使ってAjaxなページを実現する方法。一時期もてはやされた感があるが、さらなる「#!」URL批判 - karasuyamatenguの日記 など合理的な反論があり、これから導入するのはためらわれるところ。 有名なところではTwitterで使われているあの厄介者。 pjaxとは pjax
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
