GPUを活かせるCSSの工夫 - ワザノバ | wazanova
http://calendar.perfplanet.com/2014/hardware-accelerated-css-the-nice-vs-the-naughty/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約1時間前 Ariya Hidayatが、サイトパフォーマンスの改善のためにGPUをうまく活用するポイントについて紹介してくれています。 まず、期待できるGPUの効果は、ページのレンダリングを加速してくれること。 アニメーションのフレームごとにピクセルを描くのではなく、ブラウザはDOMエレメントのスナップショットを撮って、それをGPUテクスチャ（レイヤ）として保存。後で、GPUにそのテクスチャを変換させ、DOMエレメントをアニメーションしているように見せることができる。 渋滞している高速道路ではス
自分がプログラマになったときに、Webアプリケーション開発の独習で学びにくかったところをまとめる - Line 1: Error: Invalid Blog('by Esehara' )
はじめに 独学でプログラミングを勉強しても実務に通用しにくい理由 - 25歳ニートが35万円で上京を企むブログを読んだときに、僕自身もまた不安定労働から、ある程度「これだったら自分できそうだ」という気持ちで取り組み、独習のつもりで幾つものプログラムを書いたりしていた。だから、ニートからプログラマを目指して、社員として今頑張ってます、というのはすごく仲間意識を持ってしまうし、同じように頑張ってほしいという気持ちはある。 確かに、上の記事の趣旨自体、つまり「独習で学ぶことは、実務上でカバーできない部分がある」という側面があることは認めつつ、しかし、自分自身は独習したことが案外実務上で役に立っている部分もあり、その部分は明確にしたほうが、今後同じように独習して、今度プログラマを目指す人々において役に立つのではないか、と思うので、この記事を書こうと思う。 この記事で扱う「Webアプリケーション開発
MEAN(MongoDB, Express, AngularJS, Node.js)スタックが優れている理由 - Mozilla Open Web Day in Tokyoを終えて - albatrosary's blog
MEANとは、LAMP(Linux, Apache, MySQL, PHP)に変わる技術としてじわじわと注目されはじめているアーキテクチャです。このアーキテクチャMEAN(MongoDB, Express, AngularJS, Node.js)は、シンプルでかつ強力なアーキテクチャで、現在のJavaを利用したアプリケーション開発とは一線を画すところです。HTML5開発にとってJavaの役割が殆どなくなるというのも注目すべき点だと考えます。MEANで一般的に言われる注目すべき事項は次のところです： JavaScriptフルスタックである データモデルとしてクライアントからデータベースに至までJSON そして、この記事を書こうと思ったきっかけですが、2014/10/5(日) Mozilla Open Web Day in Tokyo | Mozilla Japan でのMEAN解説展示で、様
Google Analyticsも真っ青？！アクセス解析サービス「Pt engine」はサイトを視覚的に分析し、運営を大幅にサポート！
サイト運営にアクセス解析は必須だ。 自サイトに訪れるユーザーがどのような経路でどのページに辿り着き、何分間滞在して何ページ遷移してから、最終的に離脱するのか。見て欲しいページを見てもらえているのか。新しいサイトデザインは効果が出ているのか否か。ユーザー行動を分析し、それをもとにトライアル・アンド・エラーを繰り返すのがサイト運営だ。 ただ、正直なところアクセス解析の必要性は感じつつも気乗りしないと言う人も多いだろう。多くの人はGoogle Analyticsを使用していると思うが、使い方がよく分からない、と嘆く人も多い。 今回紹介する「Pt engine」はGoogle Analyticsに対して苦手意識を持つ人こそが試してみるべきアクセス解析サービスだ。サイトの分析を視覚的に行う事ができる上に、使いやすいフィルタリングでセグメント分けも可能。各デバイスごとのヒートマップ解析機能も利用できる
不特定多数の人が更新する大規模サイトに必要な CSS 設計の思想
今話題（？）の CSS 設計のメモ。 この「ある程度の規模」というのは、肌感覚としてテンプレートの枚数( ≠ Webサイトのページ総数)が 20P〜50P くらいのイメージ。 また、コーディング完了後に自分以外の人間による断続的な更新が入るという前提。 そして一番重要なのは「更新する人のスキルは定義しない。」ということ。つまり HTML の知識が乏しい人が更新する可能性があることを前提とする。 きっと1ヶ月くらいすれば変わると思うけど、自分の思想のログとして残しておく。 今ぼくは以下のことに気をつけながら CSS を書いている。 コードが長くなることを気にしない セレクタが長くなることを気にしない セマンティクスの実現の難しさを理解し、妥協する 再利用性より保守性 拡張しやすい設計 最初から最適化しようとしない ゴールは目先のパフォーマンス向上ではなく誰が触っても問題が起きにくい設計 ひと
Googleの検索品質評価ガイドラインが大幅改定、高品質サイトに求められるのは「E-A-T」
[対象: 上級] Googleの「検索品質評価ガイドライン」が大幅に改定されました。 評価対象から削除された要素があるなかで、高品質なサイトやページに必要な要素としての「E-A-T」など新たな評価要素が加わっています。 検索品質評価ガイドラインとは Googleは検索結果の品質を外部の評価者に評価させています。 その際にマニュアルとして「検索品質評価ガイドライン（英語名: General Guidelines）」を配布します。 マニュアルのサンプルは、Google検索の仕組みを紹介するポータルサイトで一般公開されておりダウンロード可能です。 しかし一般公開されているこのガイドラインはごく一部で、（僕たちSEOを施策する人間にとって）肝心な部分が大幅にカットされています。 評価者が実際に利用していると思われる本物の品質評価ガイドラインは、これまでたびたび外部に流出してきました。 直近は201
Apacheのmod_statusの各状態はどういう意味か？ - （ひ）メモ
Apacheのmod_statusを使えば各プロセスの状態を知ることができます。CloudForecastやCacti等でそれを元に視覚化している人も多いと思います。 mod_statusで確認できる状態には以下の11種類があるのですが、 状態名 値 mod_stautsでの記号 説明 SERVER_DEAD 0 . Open slot with no current process SERVER_STARTING 1 S Server Starting up SERVER_READY 2 _ Waiting for connection (or accept() lock) SERVER_BUSY_READ 3 R Reading a client request SERVER_BUSY_WRITE 4 W Processing a client request SERVER_BUSY_
スマホサイト最適化25の最新ルール | グロースハックジャパン | growth hack japan
Ryutaro Mori TwitterでGHJをフォロー！ FacebookでGHJをフォロー！ NEW スタートアップに欠かせない6種類の人間 検索エンジン大手グーグルが、スマホサイト最適化に関する大規模なリサーチを行いました。 その結果から導き出した「スマホサイト最適化25のルール」は、モバイル時代、特にtoCビジネスには欠かせない内容です。 調査に関して 本調査は、GoogleとAnswerLabの共同指揮の下に行われました。 モバイルサイトにとって最良のデザイン慣行を提言することを目的に行われた本調査は、以下の方法論で実行されています。 ・シカゴ・サンフランシスコにて、119時間のユーザービリティテストを敢行 ・iOS・Android両方を含むユーザーに調査を実施 ・ユーザーは、商品の購入、価格の調査、予約など、コンバージョンに関連するタスクを実行し、各サイトのユーザービリティを
「超チューニング祭 ～ニコニコを超快適にしてみた～ in ニコニコ超会議３」の問題点 - Webパフォーマンスについて
来る2014年4月26日(土)・27日(日)に、「ニコニコ超会議3」が開催され、その中で「超チューニング祭 ～ニコニコを超快適にしてみた～」が開催されるそうです。 これは、現行のスマートフォンサイトのTopページのソースファイルを競技者がチューニングして、速度やデザイン・UIの改善をして、速度と使い勝手を競うのだそうです。 「これは面白そうだ! 会場は家から近いし!」と思って参加するつもりでいましたが、事前調査で計測してみた結果、フロントエンドのチューニングでは速くならないことがわかったので、その内容について説明します。 (主催者の方にも、フロントエンドのチューニングでは速くならないという情報は伝えてあります。) まずは、計測データ まずは実際のトップページ(http://sp.nicovideo.jp)の計測データを見てみましょう。 計測は、NTT DoCoMoとSoftBankの3G回
インターノット崩壊論者の独り言 - 「浸透おそい」の原因はブラウザでしょ (Firefox編) - Firefox の名前解決キャッシュの謎 , Firefox の名前解決キャッシュの正体 , 結論
EPIC2014 Google Public DNS (8.8.8.8, 8.8.4.4) 経由では本サイトにアクセスできないよう措置させていただいております。 Firefox の名前解決キャッシュの動作が不可解だったので色々調べてみました。 「ISPのDNSキャッシュサーバはTTLを越えてキャッシュを保持するか?」の実験で用いている a.t.e-ontap.com は 5分毎に A レコードが切り替わるようになっています。 この http://a.t.e-ontap.com/ を Firefox 28.0 でリロードしながら観察するとおかしなことに気づきます。まず普通にリロードを行っても DNS 権威サーバ側で A レコードが切り替わっているのに、まるで HTTP の接続先が切り替わりません。さらにパケットダンプしてみると、DNSキャッシュサーバへ問合せを送り新しい A レコードを得てい
JavaScriptで読み込むCSSファイルをまるっと[7korobi8oki.com]
世界中のホームページの情報を集め、その情報を「検索結果」という形で出力する。しかもそれを「利用者が使いやすく・有益なもの」するために、Googleは複雑なアルゴリズムを日々進化させています。 そのため、Googleの「アルゴリズム（algorithm）」はとても複雑になっています。 しかし、おおまかな姿を把握しておくことは、SEOに直接携わらない人でも大事なことです。情報の良し悪しや成否の判断ができることは、誰にとってもメリットが有るはず。なぜなら、検索エンジン経由でのアクセスはほぼすべてのサイトで重要だからです。 そこで今回は、このアルゴリズムの全体イメージを図解した記事をご紹介します。 例えば「ハミングバード（Hummingbird）になったというけれども、ペンギンやパンダはもうなくなったの？統合されたの？」「手動ペナルティはペンギン・アップデートなの？」といった疑問をきれいに解消でき
![JavaScriptで読み込むCSSファイルをまるっと[7korobi8oki.com]](https://cdn-ak-scissors.b.st-hatena.com/image/square/24d2b2c1cc24564ac7e639c7a56e01b5852249b5/height=288;version=1;width=512/https%3A%2F%2Froundup-inc.co.jp%2Fwp-content%2Fuploads%2F2022%2F08%2F2013-10-23_NEW_no-seoer1.jpeg)
ファビコン・カンニング・ペーパー
Translation of: favicon-cheat-sheet ファビコンのサイズや形式についての読むと頭が痛くなる偏執的なカンニング・ペーパーです。以下のURLを参考にしました: rel="shortcut icon" considered harmful · Mathias Bynens <-- special thanks @mathiasbynens Everything you always wanted to know about touch icons · Mathias Bynens <-- special thanks @mathiasbynens Jonathan T. Neal | Understand the Favicon Favicon - Wikipedia, the free encyclopedia Making a Good Favicon -
HTTPリクエストを減らすために【序章】HTTPリクエストは甘え - MOL
このシリーズはHTTPリクエストの理解を通じてWebパフォーマンスの重要性について考える5章構成になっている。 【序章】HTTPリクエストは甘え 【CSS Sprite編】スプライト地獄からの解放 【WebFont編】ドラッグ＆ドロップしてコマンド叩いてウェーイ 【DataURI編】遅延ロードでレンダリングブロックを回避 【終章】我々には1000msの猶予しか残されていない 1日目は、HTTPリクエストの概要について説明する。 例えに、私のポートフォリオページ（t32k.me）が表示されるまでの流れを見ていく。まず、検索からでも方法はなんでもよいが、ブラウザのURLバーにt32k.meと打ち込んでアクセスする。そのページを見にいくということは、つまりt32k.meに対してHTTPスキームでリクエストするということを意味している。 クライアントであるブラウザは入力されたURLを判断して、リソ
Selenium IDE おすすめプラグインまとめ | MagicPod Tech Blog | MagicPod: AIテスト自動化プラットフォーム
Selenium IDEは、ブラウザ操作の記録と再生が手軽にできるFirefoxアドオンです。 Selenium公式サイトのダウンロードページを見ると、「Selenium IDE Plugins」というタイトルで、このSelenium IDEの機能をさらに拡張するFirefoxアドオンがたくさん並んでいます。 今回は、これらのSelenium IDEプラグインの中から、特におすすめのものを選んで紹介したいと思います。 Favoritesお気に入りテストスイートの簡単読み込み おすすめ度：★★★ Selenium IDEにテストスイートを読み込んだり、別のテストスイートに切り替える作業は、意外と面倒ですね。 このプラグインを使えば、IDEの画面に「Favorites」ボタンが追加され、テストスイートの読み込み・切り替えが簡単にできます。 使い方も簡単ですぐ覚えられます。 詳細(英語)
Webサイト負荷テストツール記事まとめ要約
急ですが、webサービスやwebサイトの負荷テストは行っていますか?どの程度のアクセスがあった場合にサーバが遅くなってしまうのかをバズる前に検証しておくべきです。 現在、Yahoo、はてブ以外にもGunosy等に載る事で簡単にバズり(普段のPV数 ＋ 想定PV数5000〜30000)その時にサーバが同時アクセスに耐えられなくなり、かなりの機会損失を被ってしまいます。自分のサーバ、または借りているレンタルサーバの能力値を理解していればそれなりの対策が打てるようになるのかなーっと。そうゆう事で負荷テストをオススメします。 今回は記事を書くというよりは負荷テストが出来るwebサービス、ツール、ソフトを紹介している記事をまとめて紹介して最後に要約していきたいと思います。 負荷テストツールをまとめている記事ベスト3 負荷テストを出来るサービスやツールを紹介しているまとめ記事を厳選して紹介したいと思い
Apache 2.4系でのモダンなアクセス制御の書き方
人間とウェブの未来（旧） 「ウェブの歴史は人類の歴史の繰り返し」という観点から色々勉強しています。2014年までの人間とウェブの未来の旧ブログです。 これまでのApache2.2系以前でのアクセス制御の書き方は賛否両論でした。僕はあまり好きじゃありませんでした。 過去のアクセス制御に関しては、以下の記事がとてもわかりやすくまとめられていると思います。 こせきの技術日記 – Apacheのアクセス制御をちゃんと理解する。 ここで、以下のように言及されています。 こんなバッドノウハウ、本当はどうでもいいと思う。Apache 3.0では、かっこいいDSL(VCL)で書けるようにする構想があるらしいのでがんばってほしい。 ということで、2.4系ではDSLとはいかないまでも、Require*というディレクティブを使ったモダンな書き方ができるようになったので、それを2.2系以前のアクセス制御の記述と比
とってもやさしいリバースプロキシVarnishの使い方 - ￢￢日常日記
RubyのウェブアプリケーションフレームワークRamazeがとってもとっても素敵なので、ただいま実験としてささいなものを作成しております。HTTPdには今話題のthinを使おうかな、と思っているのですが、こうなると考えなければならないのがリバースプロキシですよね。"reverse proxy rails" あたりで検索すると真っ先にapacheの設定方法が出てくるわけですが、なんでもapacheというのもどうかな、と思いました。設定が煩雑になりますしね。そこでリバースプロキシである varnish を試してみました。varnishに関するドキュメントはあまり多くないのですが、varnish はとっても簡単なので素晴しいと思います。せっかくですから、varnishに関する設定方法などを簡単にまとめておきたいと思います。なお、私はサーバであっても ubuntu を使っておりますので（手抜き！）
InternetExplorer10に関する調査結果書 - NRI
闇金の審査は会話だけで終わる場合がほとんどで、昔は多かった店舗型闇金の場合は契約書にサインする程度です。 最近ではLINEやSNSなどのインターネット闇金、090金融と呼ばれる実態の無い闇金が増えています。 ★希望融資額やどこからお金を借りているか聞かれる ★家族構成や勤務先を聞かれる ★銀行振り込みを行うために銀行口座を聞かれる ★返済も銀行振り込みで良いからと闇金の口座を聞かされる たったこれだけのやりとりでお金が振り込まれるので、闇金の審査はゆるいと言われているのです。 審査らしい審査はほとんど無く、個人情報を聞くために話がしたいということでしょう。 審査があるから闇金ではないと考えてはいけない 闇金の審査がゆるいと言われるもう一つの理由は審査が無いことですが、稀に審査をする闇金もいます。 ブラック歓迎！審査は甘い！などのうたい文句はほぼ闇金で、審査とは名ばかりの会話だけで終わるでし
リンクを無効化する「リンクの否認」ツールをGoogleが公開、よくありそうな13個の疑問に答えてみる from #PubCon Las Vegas 2012
[対象: 上級] サイトへの不自然なリンクを無効化できる、「リンクの否認」（英語名: Disavow Links）という新しいツールをGoogleが公開しました。 GoogleのMatt Cutts（マット・カッツ）氏がリンク無効化ツールの提供を約束したのは、米シアトルで6月に開催されたSMX Advancedでした。 4ヶ月たって待望の登場となります。 公式アナウンスをはじめあちらこちらで紹介されているのでもうご存知のはずです。 公式アナウンス（英語） 公式アナウンス（日本語訳） ヘルプドキュメント（英語） ヘルプドキュメント（日本語） Matt Cutts氏によるビデオ解説 先週参加してきたPubCon Las Vegas 2012では公式アナウンスや公式ドキュメントの公開に先立ってGoogleのMatt Cutts氏がこのツールについてキーノートスピーチで紹介しました。 そこでこの記
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
