[MySQL] ランダムにレコードを取得する

RAND()を使う場合のパフォーマンス上の留意点など、参考サイト。

MySQLでSQLのみを使用してランダム取得を劇的に早くする方法 – 僕のススメ。
http://d.hatena.ne.jp/steel-plate/20110227/1298804869

MySQLでランダムにレコードをselectする。パフォーマンス対策3つ。 – mtomizの日記
http://d.hatena.ne.jp/mtomiz/20080125/1201277390

How does it feel?: MySQLからデータをサンプリングして取得する
http://itsneatlife.blogspot.com/2013/07/mysql.html

MySQL の RAND 関数の引数 – ngの日記
http://ngyuki.hatenablog.com/entry/20120614/p1

[MySQL] 比較対象のカラムは型を意識しなければならない

要注意。

参考サイト

MySQLの日付比較 – まつぼ x Web
http://matsu.teraren.com/blog/2010/07/27/mysql-date-string/

MySQL _ 日付期間比較
http://www45.atpages.jp/miztools/cake2.php/memo/mysql_date

[ソフト] Performance-Analyser – ウェブページのパフォーマンスを解析

Performance-Analyserは、ウェブページのパフォーマンスを解析して可視化してくれるブックマークレット。Resource Timing API、Navigation Timing API、User-Timingを使っているので、それらをサポートしたブラウザでなければ動作しない。

セットアップ

ブックマークレット

Chromeエクステンション

Performance-Analyser – Chrome ウェブストア
https://chrome.google.com/webstore/detail/performance-analyser/djgfmlohefpomchfabngccpbaflcahjf

使い方

ページのロードが終わったら、ブックマークレットかエクステンションのアイコンをクリックすることで解析結果が表示される。ウェブページのチューンアップのためのツールとして便利そう。

perfbook-full

参考サイト

micmro/performance-bookmarklet
https://github.com/micmro/performance-bookmarklet

[ソフト] PerfMap – ウェブページのロード時間をヒートマップ化

PerfMapは、ウェブページのロード時間をヒートマップ化してくれるブックマークレット。Resource Timing APIを使っているので、それをサポートしたブラウザでなければ動作しない。

セットアップ

ブックマークレット

Chromeエクステンション

Perfmap – Chrome Web Store
https://chrome.google.com/webstore/detail/perfmap/hgpnhiajcdppfbogcpfdgcceepgkhdmk?hl=en&gl=GB

使い方

ページのロードが終わったら、ブックマークレットかエクステンションのアイコンをクリックすることでヒートマップが表示される。

perfmap

ヒートマップに示される色とms値は、画像のロードが完了した時間を示している。すなわち、ユーザが画像を目にするまでの時間。そして、カッコ内の数字は画像のロードだけに要した時間を示している。

ページ下端の凡例はページ全体のロード時間を示している。ヒートマップ上をマウスでポイントすると、その画像がロードされたタイミングを凡例上にインジケータで示してくれる。

ページのロード時間はブラウザ組み込みの開発者向けツールなどを使っても知ることができるけど、ヒートマップとして可視化されると、どの要素がボトルネックになっているのか一目瞭然だ。ウェブページのチューンアップのためのツールとして便利に使えそう。

参考サイト

zeman/perfmap
https://github.com/zeman/perfmap

[jQuery] AjaxでJSONデータを読み込む

サンプル

サーバーから最新のドル円レートをJSON形式で取得して、フロントエンドのUS$価格にJPY換算価格を付記する。

フロントエンド

currency.php

参考サイト

Ajax – jQuery 入門
http://jquery.keicode.com/basics/ajax.php

jQueryを使ったAjaxに関するサンプル集
http://alphasis.info/jquery-api/gyakubiki/ajax/

jQuery.ajax() | jQuery API Documentation
http://api.jquery.com/jquery.ajax/

jQuery.ajax(options) – jQuery 日本語リファレンス
http://semooh.jp/jquery/api/ajax/jQuery.ajax/options/

[jQuery] thisの子要素を取得する

サンプル

参考サイト

jQueryでthisの子要素を取得するやり方いろいろ | Base Views
http://baseviews.com/program/jquery-get-child-elements-of-this.html

【jQuery】 $(this)の親要素、子要素、隣接要素を指定する | WEB制作ブログ
https://www.markernet.co.jp/blog/2014/08/22/post-2493/

[JavsScript] 数字を3桁ずつカンマで区切って表示する

正規表現を使えば簡単らしい。正規表現不勉強の僕には理解が困難だけど(汗

JavaScriptで数値を桁区切り (カンマ区切り) にする方法
http://so-zou.jp/web-app/tech/programming/javascript/grammar/data-type/string/comma-formatting.htm

参考サイト

正規表現の構文
https://msdn.microsoft.com/ja-jp/library/Cc392020.aspx

JavaScript – 数値をカンマ区切りにする – Qiita
http://qiita.com/zawascript/items/922b5db574ef2b126069

[JavaScript] 基本メモ: 数値の丸め、切捨て、切り上げ

整数化する

小数点以下2桁にする

少数点の精度に関する参考サイト

javascriptの小数点端数処理についていったん整理する | yosiopp
http://yosiopp.net/archives/1096

JavaScriptによる小数計算の誤差を無くす : アシアルブログ
http://blog.asial.co.jp/1191