GitHub - systemjs/systemjs: Dynamic ES module loaderYou 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
x >= x pattern in JavaScript
When reading source of D3.js I saw x >= x pattern. If it is for detecting NaNs among numbers, why not just isNaN(x) or x == x? Source, where I encountered it: d3.min = function(array, f) { var i = -1, n = array.length, a, b; if (arguments.length === 1) { while (++i < n) if ((b = array[i]) != null && b >= b) { a = b; break; } while (++i < n) if ((b = array[i]) != null && a > b) a = b; } else { whil
JavaScript の Array#sort で return 0 すると要素の順番は不定になります - latest log
qiita.com を拝見してました。心当たりがあるのでメモ程度に。 JavaScript の Array#sort は仕様的に非安定ソートで、実際もそうです。実装により異なる結果が得られます。 より具体的には、 [...].sort(function(a, b) { return 0; }); と評価関数の中で return 0 してしまうと要素の順番は保証されません。 return 0 を使わずに記述してください。 この問題については、 http://ofb.net/~sethml/is-sort-stable.html を参照していただくと学びがあります。 以下は僕のツイートを Array#sort で検索した時にでてくる駄文です。見事にいい感じに苦しんでますね。みなさんは気をつけてください。😃 モジュールの依存関係を解決する部分のロジックは8回ほど書き直しました。確かにあれ全く簡
オレ流AngularJSを使った設計ポリシー
Chrome MySQL Adminでは、 AngularJSを使って実装を行っています。Chrome appsでは、 何らかのMVC Frameworkの利用が勧められています。 AngularJSは、Controller、Directive、Template、Serviceなど、いくつかの部品群を組み合わせてアプリケーションを構成することになります。その機能の豊富さ故に、実はちゃんとしたポリシーを決めておかないと、いかようにでも作れてしまうために、かえって複雑さが増してしまうという危険性も出てきます。もちろんアプリケーションの作り始めは試行錯誤の連続なのですが、徐々に自分なりのポリシーみたいなものが確立されてくるはずです。 本エントリでは、Chrome MySQL Adminでの設計/実装ポリシーを簡単に紹介してみたいと思います。ちなみに、全てのソースコードは、以下にあります。 htt
GitHub - sighjs/sigh: multi-process expressive build system for the web and node.js, built using baconjs observables
Sigh is a declarative functional reactive build system for the web and io.js/node.js. Sigh combines the best features of the best asset pipelines with unique features including best speed by delegating tasks to multiple processes and perfect source maps even in production builds. With sigh sub-second incremental production rebuilds are a reality, including source map support allowing you to debug
HTML の linkタグに prefetch 機能が追加され、より便利になるようです - latest log
linkタグに pre fetch 機能を追加する仕様 (Editor's Draft)が上がってきています。 Chrome - indevelopment IE - サポートするかも Firefox - 不明 Safari - 不明 <link rel="preload" href=“…" as=“…" onload=“…” onerror=“…”> 従来は、new Image や XHR と DOM API を使ってリソース毎に別々のJavaScriptを記述する必要がありましたが、お手軽になりますね。 これまで var img = new Image(); img.onload = function() { document.body.appendChild(img); }; img.onerror = ... img.src = url; var script = document
pixiv小説縦書き機能 開発の裏側 ～横のものを縦にする～ - pixiv inside [archive]
はじめましてこんにちは。pixivでアルバイトをしているhakatashiです。 さる6月10日、パソコン版pixiv小説にて縦書き表示機能がリリースされました。この開発のあらかたを担当したので、今回の縦書き機能開発における裏側を紹介いたします。 構想 縦書き機能開発にあたり、設計段階からその大部分を一任されました。小説機能開発において自分の中に絶えず理念として存在していたのは、ユーザーに最高の読書体験を提供することです。縦書きによって得られる利益を最大化し、快適な閲覧を支援するために、以下のような構想を置きました。 縦書き横書きの組版の差異における違和感を可能な限り軽減すること。 スクロールとページングを融合した、柔軟で快適な閲覧インターフェイスを提供すること。 この2点について詳しく解説します。 縦組版 まず、ウェブブラウザで縦書き表示を実現するにあたり、どのような手法をとるかという問
![pixiv小説縦書き機能 開発の裏側 ～横のものを縦にする～ - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/42b05f8ac8050aea9f7fb4b003049236331f79a6/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F03da7790ad0c71ba4d7ef7636d5a6d3015727d04%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttp%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fh%252Fhakatashi%252F20150615%252F20150615155753.png)
ここ数年前から2015/5までのモダンフロントエンドを総まとめしてみた
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? HTML5や、次々と台頭するJavaScriptフレームワークにみられるように、現在のフロントエンドは異常なほど動きがあります。 常にキャッチアップしていないと、いつのまにかOLDな技術を使い続けることになります。実際に今回記事にしてみて、ちょっとつらくなりました。。 しかし、フロントエンドエンジニアとしてコードを書いていて（最近は主にJavaScript）、そのおもしろさに日々驚いています。 そこで今回は、ここ数年~2015年のフロントエンド界隈で一度は流行った技術、今後の動向などをまとめました。タイトルにモダンとありますが、その辺は
フロントエンドの祭典！「O'Reilly Fluent」に行ってきました - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは！開発部の刈川です。今回はO'Reillyがサンフランシスコで開催しているフロントエンド系のカンファレンス「Fluent Conference 2015」に参加してきたので、そのレポートを紹介したいと思います！Fluent？なにそれ？って方や、来年参加しようと考えている方の参考になれば幸いです。 Fluentとは？ Fluentは主にフロントエンドの技術を中心としたカンファレンスです。 今年はサンフランシスコのホテル内で3日間開催されました。 開催形式はkeynote＋ワークショップ＋ショートセッションといった構成で、ワークショップのみ事前予約制であとは自由に聴講できます。 各セッションでは基礎的なJavascriptやCSSなどのフロントエンド技術の経験が求められますが、参加するセッションによってその程度はまちまちです。 年によってメインとなる技術が異なり、今年は特にReact
mermaid.jsが素晴らしいけどなかなか使ってる人見かけないので実例晒す(追記あり) - Qiita
mermaid.jsとは JavaScriptのチャート作成ライブラリです。他にも似たようなのは色々ありますが、これ一本でフローチャート、シーケンス、ガントに対応してるので、個人的にお気に入り。 http://knsv.github.io/mermaid/ サイトの各チャートのページ見ると書き方と何ができるかはわかるので、ご覧あれ。 僕の使い方 JSのライブラリを自分でインポートして何かすることはほとんど無くて(後述の理由からガントだけJSで使ってるけど)、基本的には以下の2つの方法で使ってる。 Haroopad フリーでクロスプラットフォーム(OS X, Win, Linux)なMarkdownエディタ。 v0.13からmermaid.jsがインテグされているので、何もしなくてもそのまま使える。 mermaid.jsのグラフの書き方は、コード表記で、言語をmermaidにしてあげるだけ。
Rubyist Magazine - スはスペックのス 【第 1 回】 RSpec の概要と、RSpec on Rails (モデル編)
『るびま』は、Ruby に関する技術記事はもちろんのこと、Rubyist へのインタビューやエッセイ、その他をお届けするウェブ雑誌です。 Rubyist Magazine について 『Rubyist Magazine』、略して『るびま』は、Rubyist の Rubyist による、Rubyist とそうでない人のためのウェブ雑誌です。 最新号 Rubyist Magazine 0065 号 バックナンバー Rubyist Magazine 0065 号 Rubyist Magazine 0064 号 Rubyist Magazine 0063 号 Rubyist Magazine 0062 号 Kaigi on Rails 特集号 RubyKaigi Takeout 2020 特集号 Rubyist Magazine 0061 号 Rubyist Magazine 0060 号 Ruby
ES6 ModulesはHTTP/2によってconcat無しで使えるようになるのか - teppeis blog
HTTP2 時代のサーバサイドアーキテクチャフィードバック - Togetterまとめ のあたりで話していたことのまとめ。 補足 タイトルで「ES6 Modulesってconcatしないと動かないの？」と一部に誤解を与えてしまったようなので補足。ES6 Modulesがブラウザにネイティブ実装されたら、当然concatしなくても動きます。 ここで書きたかったテーマは「ES6 Modules + HTTP/2 + concat無し は ES6 Modules + HTTP/1 + concat と同等の速度で動作するのか」です。 追追記 (2016/01) kazuhoさんはh2oで Cache Aware Server Push という解決策を提案しています。 Jxckによる日本語解説記事: HTTP/2 Push を Service Worker + Cache Aware Server
本当のClosure Compilerをお見せしますよ。
天下一altJS武闘会での発表 http://connpass.com/event/6402/ Google Closure Compilerの最新事情について
JavaScriptが20周年。開発者のBrendan Eich氏が過去と未来についてのスライドを公開
JavaScriptが20周年。開発者のBrendan Eich氏が過去と未来についてのスライドを公開 今月、2015年5月はJavaScriptが登場してからちょうど20年にあたります。20年前にJavaScriptを開発し、現在Mozillaに所属するBrendan Eich（ブレンダン・アイク）氏が、JavaScriptの過去を振り返り、未来について触れているスライドを公開しました。 このスライドの公開を知らせるBrendan Eich氏のツイートには「#modernweb2015」のタグが付いています。 JavaScript at 20 - http://t.co/CPXEnl5Dcp #modernweb2015 — BrendanEich (@BrendanEich) 2015, 5月 15 このタグは2015年5月15日に台湾の中央研究院人文社會科學館が開催したイベント「Mo
Node.js と io.js の統合は最終局面へ - from scratch
いくつかこの何日間でニュースが出ているので紹介します。 ちなみに、 io.js と Node.js のニュースに関してはこれまで２つ書いたので、まだ良く知らない人はそれをまずはご一読ください。 yosuke-furukawa.hatenablog.com yosuke-furukawa.hatenablog.com さて、次の展開へ、という事でいくつか話があります。 「Join the Node Foundation?」 というissueが mikeal から提案される github.com issue 本文を翻訳したものを貼っておきます。 Node Foundationのためのすべての文書が揃った。 TSC Charter (技術委員会の目的) Development Policy(開発ポリシー) Convergence Plan(移行プラン) Project Lifecyle (Wor
JavaScript を PNG に圧縮する | Yomotsu net
JavaScript を PNG に圧縮するツールを作りました。JS_Packer demoscene は最近 WebGL を使ったものも多くなってきています。 demoecene は基本的に ローカルにファイルとして存在しているものを使う そのファイル容量は 1 バイトでも少ないほうがいい (容量制限がある分野がある) という文化です。そして JS ファイルを圧縮する手法の一つに、JS を PNG 画像にして、それをデコードする、という手法が存在します。 JS の性質JS のコードは基本的にアスキー文字の集まりです。アスキーコードは、小文字/大文字のアルファベット、数字、スペースといった 128 種類しか存在しません。 PNG8 の性質8 ビット PNG は 256 種類の色をパレットに持っています。 PNG は可逆圧縮（ロスレス）形式の画像です。圧縮しても失われるデータはありません。
JSで切り替えたページにBackで戻れるようにする - Qiita
ページを読み込み直さずにJavaScriptでタブ切り替えやページャーで表示を変えた場合、そこからリンクをクリック等で別のページに遷移した後にブラウザのBackやhistory.backで戻って来ると、初期表示のページになってしまいます。 そこで、HTML5で導入されたhistory.replaceState()を使って現在の履歴を表示状態を含むものに書き換えて、Backで遷移直前の表示状態に戻れるようにします。 以下、jquery.pajinateを使ったページングがあるページを例に挙げます。 <div id="link-list"> <ul class="content"> <li><a href="path/detail/page1.html">リンク1</a></li> <li><a href="path/detail/page2.html">リンク2</a></li> ・・・ <
最速MVCフレームワークMithril.jsの速度の秘密 - Qiita
Mithril 0.2が本日リリースされました。ちょっとURLが変わったり( http://mithril.js.org/ )、API名が一部(m.moduleがm.mount)変わっていたり、コンポーネント機能がコーディング規約レベルから、専用のサポートAPIが追加されたりしていますが、0.1系と大した差はなさそうです。 某node.js会長とはいろいろ社内で話をしたりしたのですが、各種ベンチマークでもトップクラス、平均的には最速のクライアントサイドMVCフレームワークという称号を持ちながら、国内ではまだまだ知られていないMithril。レンダリング速度は仮想DOMの代名詞となったReact.jsの5倍以上(ベンチマークによります)です。 ↓ホームページから転載 ちなみにこちらのベンチマークで計測すると、MithrilはReact.jsの10倍以上速い結果になるのですが、これはちょっと計
NW.js
NW.js (previously known as node-webkit) lets you call all Node.js modules directly from DOM and enables a new way of writing applications with all Web technologies. New way of writing native applications using web technologies: HTML5, CSS3, and WebGL Full support for the features in browser Complete support for Node.js APIs and all third party modules Call Node.js modules directly from the DOM and
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TechCrunch | Startup and Technology News
