前回のエントリ(ブラウザのキャッシュコントロールを正しく理解する)でブラウザ側のキャッシュ制御について説明しました。 ただ動的スクリプトなら、次の例のようにHTTPレスポンスヘッダを操作すればいいのですが、 <?php header('Content-Type: text/plain; charset=UTF-8'); header('Cache-Control: max-age=0'); echo "Hello World!"; ?> スクリプトを介さない静的リソース(HTMLファイル、JSファイル、CSSファイル、画像ファイルなど)はどうやってHTTPレスポンスを操作すればいいかというと、もしApacheを利用している場合は mod_header と mod_rewrite を利用して次のように簡単に出来ます！ 設定例 想定ケースとして、次のようにブラウザ側のキャッシュを制御したいと仮

イマドキApacheのチューニングなんてしなくてもちゃんと動くだろうと思ってたら痛い目にあったので、書いてます。基本をおろそかにするとよくないですね。 [追記] スライドも作ってみました。良かったら見てください。 http://www.slideshare.net/yumemikouda/apache-69549461 前提 Apache2.x系です preforkでの起動です 写真はイメージです WEBサーバ数台＋DB2台（マスター1、レプリカ1）程度のトラフィックを前提 大規模だとまた話が変わってきます mpm関連 パラメータ説明 項番 項目 説明 補足

このblogで使用しているwebサーバーはnginxです．設定に苦労したものの，とりあえず安定して運用できていると思っています． 今回は，webサーバーでメジャーであるapacheの高速化について検討してみました．やってみたのは，mod_spdy,Zend OPCache,mod_deflate,mod_cacheなどです． 今回は，123systemsで借りているOpenVZ VPSで実験してみます． 123systemsでは，512MBのVPSが年間$14，1GBのVPSが年間$19，2GBのVPSが年間$30と激安なんです． また，時々セールがあり，更にお安く購入できます． とはいえ，購入したVPSには当たりとハズレがあるようで，私は2つ使用しているのですが1つはほとんど止まらないんですが，もう1つはしょっちゅう止まっています．先週も数日止まっていたのでサポートからこのままだとVPS

apacheは初期状態から少し設定するだけで、メモリの消費量を減らし、スピードを早くすることができます。 変更は基本的にhttpd.conf上を書き換えていきます。 いらないmoduleを消す httpd.confを開いて、　/LoadModule でモジュールを探します。 使っていないモジュールの頭に#をつけて動かさないようにします。 例えばこんな感じです。 #LoadModule userdir_module modules/mod_userdir.so 基本的にあまり使わないモジュール群 mod_userdir ユーザーファイルでホームページ表示をするためのモジュール /home/user名/????とかでホームページを表示していなかったらいりません。 mod_status apacheサーバの状態を監視するためのモジュール いつもサーバーの状態を監視する必要性がないかたはいりません

アクセスが上がらない 申し込みが増えない これらの理由は「記事が少ない」「充実していない」「動線が悪い」 etc… 色々と原因はありますが、一つの要因としてホームページが重すぎること、いわゆる読み込みに時間がかかっていることが原因かもしれません。 先日、出張サポートにてアドセンスからの収入があるときから落ちたという相談を受けました。 Webサイトの読み込みスピードを確認できるツールでみてみると、確かに遅くなっている要因を発見。 そこで今回はこのような状況を改善するべく僕の環境でテストしたところ、読み込みにかかっていた時間が54%ダウンし体感でもかなり早いと感じるように！ ツールの使用方法からスピードの確認、原因の突き詰めと解消方法まで実例を交えてご紹介します。 まずは現在の状況と読み込み速度を確認 Googleが社内で使っていたページ高速化のツール、PageSpeed Insightsを使

Apacheのログファイルはrotatelogsでローティションさせる事が出来ますが、logrotate.dでもApacheのログファイルをローティションさせる事が可能です。以下はlogrotateにより1日単位でApacheのログローティションさせる場合の設定メモです。 /etc/logrotate.d/httpdに以下のように記述しておくと、1日単位でApacheログファイルをローティション出来ます。AmazonLinux + Apache2.2.29環境で確認しました。 ■環境 AmazonLinux Apache2.2.29 ■ログローティションさせたいApacheログファイル /var/log/httpd/access_log /var/log/httpd/error_log ■ログローティション設定 以下のファイルを作成します。 # vi /etc/logrotate.d/ht

Apacheのログファイルをローテションさせるrotatelogs設定方法の備忘録です。 logrotate/rotatelogsの違いについて logrotateのApacheの設定ファイル（/etc/logrotate.d/httpd）を見てみると・・・ /var/log/httpd/*log { missingok notifempty sharedscripts delaycompress postrotate /sbin/service httpd reload > /dev/null 2>/dev/null || true endscript } [service httpd reload]とあり、ローテートのタイミングでapacheの設定ファイルの再読み込みがかかります(詳細は/etc/init.d/httpdを確認すること)。実行中のリクエストの処理を中止してしまいます。

エフェクト作成ツール「Effekseer」(エフェクシアー)を使ったエフェクト作成の入門講座第2弾です。普段エフェクト作成やゲーム開発をしない方も、本記事をきっかけにエフェクト作成に興味をもってもらえたら嬉しいです。前回のエフェクトと同様に、作成したエフェクトはUnityに読み込んで使用したり、連番画像ファイルに出力することでWebGLやFlash等にも利用できます。「Effekseer」の使い方は前回の記事「エフェクト作成入門講座 Effekseer編 UVスクロールを使ったマグマエフェクトの作成」で解説していますので、あわせてご覧ください。 今回のお題：リング描画を使った乱れ斬りエフェクト やってみよう：デモエフェクトの作成 エフェクトの構成図です。今回は大きく6つのパーツから成り立っています。サンプルファイルをダウンロードして、記事と照らし合わせながら進めることができます。各エフェク

rot.js: ROguelike Toolkit in JavaScript 「rot.js」はローグライクゲームを作成するのに便利なライブラリです。 “ローグライクゲーム”とは、ダンジョンが自動作成されるタイプのRPG(トルネコの不思議なダンジョン、風来のシレン等）のことですが、rot.jsによって提供される機能は、通常のRPGやシュミレーションゲームなどを作るのにも便利そうです。 ■　マップ自動作成 さまざまなタイプのマップを自動で作成することができます。 HEXタイプのマップも作成できます。 ■　最短距離探索 ２点間で、障害物をよけながら最短の経路を検出します。 ■　FOV プレイキャラクターの現在位置から見えるエリア(視界)を検出します。 その他、ターンを管理する機能などがあります。

・データベース的な観点でのソーシャルゲームの特徴 ・データモデル ・ソーシャルゲームに従来型RDBMSを使うべきか、�流行りのNoSQLで行くべきか ・負荷対策 (アーキテクチャ面) ・負荷対策 (ツール面) ・インフラエンジニアのキャリアについて

いままでリバースプロキシの設定がよくわかっていなくて、すでに動いているサーバの設定を見よう見まねで使い回してきた。ちゃんと理解しようと思って、マニュアルを読み直したらやっとわかった。設定の方法 (How) がわかったこと以上に、なぜそう書く必要があるかという理由 (Why) を理解できたのが嬉しい。久しぶりに「わかった！」と叫びたくなった。感動を忘れないうちに、思い出せるように、書いておく。 mod_proxy - Apache HTTP サーバ バージョン 2.2 が Apache のプロキシ関連のマニュアル。 mod_proxy を使うことになる。 大事なディレクティブは、 ProxyPass と ProxyPassReverse のふたつ。 ProxyPass これがリバースプロキシをする上でのほとんどすべてのことをやってくれる。実は見慣れた (コピペし慣れた) 設定ではこのディレク

ioDrive＋MySQL勉強会でチラリと紹介したMySQL Percona Serverですが、並列処理やDiskI/Oに配慮された設計だけではなく、それ以外にも様々な強みがあるので紹介していきたいと思います。 Percona関連の日本語情報はまだまだ少ないようですので、自分の復習も兼ねて基本的なところから少しずつ書いていきます。 はじめに 表記について MySQL Community ServerをMySQL PerconaのMySQLをPercona Serverもしくは比較時には単にPercona あえてファイル名をmysql_perconaのようにしている所は、無関係者にMySQLの設定と理解してもらうためです 記事の書き方について わかりやすくするため記事を小分けにして長期に渡って書く予定です。そのため気分によって途中で別ジャンルの記事を挟むこともありますが、ちゃんと続けます。

2ヶ月前にインフルエンザとウィルス性胃腸炎でひどくダメージを受けた増田(@masudaK)です。アメーバピグは2009年2月に始まったサービスで、FLASH・Javaで作られています。そして、データストアにMySQLを用いてます。本記事では、わたくしが2年ほど見続けているアメーバピグのDB環境について構成や、日々どのようにして問題と向き合っているかを紹介したいと思います。インフラ寄りの内容が多いため、アプリ寄りの話は弊社生沼の資料を御覧ください。 1. 構成と規模 1.1. 構成 まず構成ですが、読み書きはすべてマスターへ行うようにしています。そのため、スレーブには参照を向けず、ホットスタンバイとして使っています。バージョンに関しては2012年中旬までは5.0を使ってましたが、DC移転にあわせて5.5にあげました。ロック機能を用いたシャード構成をしてまして、2014年3月現在6シャードにな

技術部の小野(taiki45)です。クックパッドではこれまで様々なデータベースの負荷対策を行ってきましたが、シャーディングは行われていませんでした。しかし先日クックパッドの認可サーバーが利用している MySQL サーバーの負荷分散のためにクックパッドで初めてのシャーディングを行ったので、Rails アプリケーションでのシャーディングの事例のひとつとしてその際の手法をご紹介したいとおもいます。 構成 Before データベースは1マスター、1ホットスタンバイ、バッチ用の1リードレプリカで構成されています。Read オペレーションのほとんどはキャッシュ層に逃しています。 After データベースの各ロールにつきそれぞれ1台ずつマシンが増えています。 シャーディングが必要になった背景 認可サーバーのアクセストークンの作成・削除時の Write オペレーションが急増し、レコード数自体も急増していて

皆さんの方がよくご存知だと思うますが、MySQLの互換DBサーバー「Percona Server」 高性能な上に、MySQLと完全に互換ということで、個人的には使わせてもらっています。 でも、 ガチの商用で使っている方たちってどんな運用しているんだろう？ 障害とか無いの？ などなど、疑問を解決できれば！とMeetupに行ってきました！ 「About Percona」株式会社スマートスタイル 野津 氏 少し遅れて会場に到着したので、こちらのセッションから。 「Percona 社製品」の日本語でのサポートしている「株式会社スマートスタイル」さん Percona製品郡について、紹介くださいました！ 「Percona 社の製品」は全てがオープンソースで、利用については無償で利用が可能 サポートは有償という形でビジネスをされているようです！ 名前は知っているけど、知らない。って製品が多く非常に勉強に

コーポレートサイトや飲食店のサイトなどの定番コンテンツ「Access」にGoogleMAPを埋め込むのはよくあることですが、通常のGoogleMAPからiframeで地図を埋め込むこともできますが、横幅と縦幅ぐらいのカスタマイズしかできないので、応用が効きません。そんな訳で今回はGoogleMaps APIを取得して、GoogleMapをカスタマイズする方法を備忘録としてまとめておきます。 GoogleAPIを取得してGoogleMAPを表示 まず、ごくごくシンプルに地図のみを表示するやり方 （1）head部分に以下のスクリプトを記述 <script src="http://maps.google.com/maps/api/js?sensor=true"></script> （2）bodyタグにスクリプトを読み込ませるための「onload=”initialize();」を記述。 divのI

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

SVG（Scalabe Vector Graphics）の世界は魅力的です。そして、これを使ってできることや、これに用意されているオプションには圧倒されてしまうほどです。 SVGはXMLベースの2次元ベクター画像形式で、インタラクティビティとアニメーションをサポートします。言い換えると、SVGは図形やグラフをレンダリングするXMLタグで、その図形やグラフはHTMLの構成要素がそうであるように、インタラクトしたりアニメーション化したりできるのです。 SVGに関して、私がよく受ける質問の1つは、SVG画像のアニメーション化についてです。そのやり方だけではなく、それが何なのかということも聞かれます。ですから、現在の（そして未来の）SVGアニメーションの状況を見ながら、あなたが苦痛を感じずに行えるようなヒントやツールについてお話ししましょう。 同期マルチメディア統合言語、またの名をSMIL（Syn

CSS3を使うと、静的な表現だけでなく、アニメーションやインタラクションが加えられます。その作例を8つご紹介します。最後の例を除いて、JavaScriptコードは書きません。いずれも中身は、リンクしたノートで詳しく解説しています。 01 テキストのアニメーション ただのテキストでも、フォントを選んでCSS3でアニメーションさせると、表現力は大きく高まります。 01-01 テキストをイルミネーションのように点滅させるアニメーション 「Monoton」フォントを使って、text-shadowプロパティで光彩を与えました。そして、animationプロパティにより、イルミネーションの点滅のようなアニメーションを加えています(サンプル001)。 サンプル001■CSS3: Flickering billboard light refined 01-02 テキストを順に浮かび上がらせては消すアニメー

2014年7月12日（土）に福岡工業大学にて開催されたFuture Sync Vol.4のパネルディスカッション「作ろう！LINEスタンプ 〜スタンプクリエイターの語り場〜」の当日スライドです。