GitHub - mitsuruog/SPA-with-Backbone: Backbone.jsでsingle pageアプリケーションを作る方法You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
material uiをRailsで使ってみた - Qiita
material uiはreact.jsを使ってMaterial Designを実現しています。 material uiはbrowserifyと一緒に使うことになります。 そこでbrowserify-railsを利用してみました。 この方法だとJavaScriptを変更する度にbrowserifyが実行されてとても重いです。 また、railsプロジェクト内に埋め込みする利点も浮かびません。 そのため、この手法はおすすめしませんが、せっかく試したので記録を残しておきます。 作成したソースコードはeiel/material-ui-rails-sampleに置いています。 利用方法 利用するには、rubyとnodejsがインストールされている状態で
JavaScriptを短く書くためのショートコード集
JavaScriptを短く書くためのショートコード集 知っておくとちょっとだけコードが簡潔に書けるかもしれないショートコード集です。 投稿日2014年12月25日 更新日2014年12月25日 小数点以下切り捨て 「Math.floor」で切り捨てですが、 Math.floor(12.6598); //12 数値の前に「~~」付けるだけでもできます。 ~~12.6598; //12 桁数の制御 「～e」に続く数字で桁数を制御できます。 1e1 //10 1e2 //100 1e3 //1000 1e4 //10000 1e5 //100000 2の累乗はシフト演算子 2の累乗は左シフト演算子（<<）でできます。 200 << 1; //400 200 << 2; //800 200 << 3; //1600 逆は右シフト演算子（>>）です。 200 >> 1; //100 200 >> 2
Post by @0-9
ここでは以下の順番でSinonJSとJsTestDriverを使用したJavaScriptのUnitTest Patternsを紹介します。
io.jsについて知っていること - from scratch
今、Node.jsに起きてることを語る上で、io.jsは避けて通れない話題でしょう。 今回のNode.js アドベントカレンダー 2014の締めを飾るために、このio.jsについて僕が知っている限りの事をまとめて書くことにします。 io.jsを知り、今後"Node"がどうなっていくのかを皆で一緒に考えていきましょう。 またこの一連のio.jsのfork騒動はOSSという特殊なプロジェクトをどう進めていくのがハッピーなのかを知る一つの教材だと思います。 OSSに関わっている皆さん、今回も長いですが、最後まで読んでもらえると幸いです。 io.js とは何か Node.jsのForkです。次のNode.jsの安定版になる、v0.12をForkしています。「アイ・オー ジェイエス」と読みます。名前の由来は木星にある四番目に大きな衛星の名前から取られました。*1 Nodeを使っている人のことをnod
Flux react現状確認会
Google playでのリワードアプリリジェクトからの今後のマネタイズ手段について インタースティシャル広告×クロスプロモーション-
script要素のdefer属性の実装 - Thousand Years
<!--HTMLでは--><script defer></script> <!--XHTMLでは--><script defer="defer"></script> script要素にはdefer属性があって、これはdocument.write系がないことを条件にscriptの中身を後で評価することによってページのレンダリングを妨げないようにするものと説明されている。ただdeferが利用されているサイトってなかなか見たこと無いうえに本当にレンダリングを妨げないか興味があったので調べた。 実装されているブラウザ 調べた範囲ではIE(SafariとKon〜は調べてない)のみ。あとIEはscript要素にdefer属性をつけるとinnerHTMLに代入したscriptが実行されるという仕様がある。 // 以下は動かないので駄目 hoge.innerHTML = "hoge<script>aler
Google Web Fonts を非同期で読み込みをして表示改善する方法
このブログのタイトル見出し部分を Google Web Fonts を利用して表示しているのですが、これまではhead内でフォントの指定とCSSの font-family での指定を入れていました。そのようにしていたところ、Googleのツールで、遅延して読み込ませるなど工夫しなさいと Warning が出てしまっていたので、ちょっとだけ改善を試みることにした。 Google Fonts Google Web Fonts は遅い？フォントを選択する際に、スピードメーターのような表示の部分は赤いところを指し示していたことは事実だけど、体感的にはそれほど遅いと感じていませんでした。 Google Web Fonts の利用自体が遅いための警告かと思っていたのですが、今回指摘されたのは、ファーストビューでの表示が遅い・見えててほしい部分が見えないよということの様子。 Chrome で確認してみた
なぜWebフォントを非同期に読み込むのか
Webフォントを非同期に読むテクニックはいくつかあるけど、その理由についてまとめられた文章は少ない。僕は非同期に読み込むのは3つのそれぞれ違う分野での問題を解決するためだと考えている。どの問題も致命的なものではないので、非同期に読み込むべきかどうかはそれらをどう捉えるかで変わってくる。 Webフォントのファイルサイズ 最もわかりやすいのはファイルサイズ、つまり転送量の問題。日本語フォントを例に上げるまでもなく、そこそこの範囲のユニコード記号や絵文字をサポートするだけでもかなりのサイズになる。カーニングやリガチャなどを加えれば更に大きくなるだろう。非同期に読み込むことにより、ダウンロードが終了するまでページの読み込みが終わらないなどということは避けられる。 しかし、これは日本語フォントでもたかだか3から5MBほどなので、それほど気にすることではない。モバイルのことを考慮してようやく「できれば
Webフォントの非同期読み込み - Weblog - Hail2u.net
Webフォントの読み込みは@importだと色々まずいので、主にlink要素を使って並列に読み込むわけだけど、これもまた貴重なHTTPリクエスト数を消費するとか、CSSのパース完了が少し遅れるなどあって、完璧な解というわけじゃない。それを非同期にWebフォント定義の含まれるCSSファイルを読み込むようにして、Webフォントのロードをページのレンダリングと並行して行わせるのはどうか、という試み。 非同期化することによりWebフォント定義の含まれるCSSファイルのリクエストとパースが、ページのレンダリングと並行して行われるようになる。head要素内でlink要素を直接書いた場合は、Webフォント定義の含まれるCSSのリクエストとパース後にページのレンダリングが始まることが多いので、体感速度(ページのレンダリングの開始までの所要時間)は向上する可能性が高い。 動的なlink要素の追加 いわゆるソ
scriptのdefer/asyncを理解し、ページの高速化方法を探る | ゆっくりと…
Yslow ルールでは、スクリプトはページの最後尾、つまり </body> 直前に置け、と言っています。なぜなら、スクリプトの読み込みや実行により、他のページ要素の読み込みやレンダリングがブロックされてしまうからです。 一方、古くは IE4 の時代から Microsoft はこの問題に対処するため、defer 属性という独自の解決策を実装してきました。これは HTML 4.01、XHTML 1.0、1.1 で仕様として採用され、HTML5 にも発展する形で引き継がれています。 IE 以外のブラウザも既に対応されており、IE の独自仕様という色合いが濃かった従来と異なり、これからは広く利用されていくのではないかと思います。 下のビデオは、スクリプトの位置と defer 属性のあり／なしによる、ページの読み込み／表示速度の違いを Pagetest.com でテストしてみたもので、明らかな差異が
ControlJS part 1: async loading | High Performance Web Sites
December 15, 2010 10:45 pm | 30 Comments This is the first of three blog posts about ControlJS – a JavaScript module for making scripts load faster. The three blog posts describe how ControlJS is used for async loading, delayed execution, and overriding document.write. The #1 performance best practice I’ve been evangelizing over the past year is progressive enhancement: deliver the page as HTML so
SURGAVIP 🌟 Broadcasting Empire Bongkar Pola Gacor Terkini
Dalam dunia hiburan digital, SURGAVIP kembali menjadi sorotan setelah Broadcasting Empire merilis ulasan eksklusif mengenai pola permainan dari salah satu provider terfavorit, yaitu Pragmatic. Penelusuran kali ini berfokus pada peluang kejutan jackpot maxwin yang sedang ramai diperbincangkan komunitas game online. Broadcasting Empire menyoroti bagaimana konsistensi kemenangan dalam game pragmatis
$ is not defined - ３割の働きアリ
$ is not defined こいつのせいで小一時間はまってしまいました。 結論から言うとscriptタグの内容を誤タイプしてしまったせいで、 jQuery本体を正しく読み込んでなかったせいです。 個人的に間違えやすそうなところは 1.type属性 type="javascript"としてしまったため、動きませんでした。 ただしくは、type="text/javascript" 2.src属性 ちゃんとjQuery本体までのパスを確認しましょうね。 3.最初にjQuery本体を読み込む 外部ファイルにjQueryを書いている場合に起こります。 検索してたら他にもprototype.jsと一緒にjQueryを使っていると、 $ is not definedが出てしまうケースがあるそうです。 くだらないことで時間を無駄にしないようにしましょう。
jQuery $.ajaxでJSON・JSONP読み込みに使用する主なオプション
はじめに 簡単にJSONまたはJSONPを読み込みたい場合は以前の記事を参照。 1分でわかるjQuery $.ajaxによるJSON・JSONP読み込み方法 type 主にGETかPOSTを指定。受け取るときはGET、送信するときはPOST。 url 読み込み先または送信先のURLを指定。例えばJSONを読み込みたいときは以下のようになる。 $.ajax({ type: 'GET', url: 'https://iwb.jp/s/js/data.json' }); $.ajaxのurlオプションを使用したサンプル cache キャッシュの有無をtrueかfalseで指定。注意しなければいけないのはJSONの場合はデフォルトでcache:true、JSONPの場合はcache:falseとなっている点だ。つまりJSONをキャッシュをしたくない場合はcache:falseを指定しなければならな
ページ読み込み時に実行するjavascriptについてのTips | Tips Note
ページ読み込み時に実行するjavascriptは 指定方法がいくつも存在するため、 複雑になりやすく、度々エラーの原因になります。 【指定方法の種類】 ■onloadイベント ページ読み込み時に実行したい処理がある場合、 通常はjavascriptのonloadイベントを使用します。 BODY要素にonload属性を追加したり、 下記のようなjavascriptの指定を追加する方法がよく見られます。 window.onload = function(){ // ページ読み込み時に実行したい処理 } ■jQueryのreadyメソッド ライブラリとしてjQueryを使用している場合は、 readyメソッドを使用して、ページ読み込み時にjavascriptを実行することができます。 $(document).ready( function(){ // ページ読み込み時に実行したい処理 }); 【
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript Best Practices - NITISH KUMAR - Programming Discussion Blog
javascript - CSS delivery optimization: How to defer css loading? - Stack Overflow
GitHub - fnando/i18n-js: It's a small library to provide the I18n translations on the Javascript. It comes with Rails support.
cjs を javascript から使う方法 - 夜の Discovery