2016年度の京大マイコンクラブ(KMC)の新入生プロジェクトである「JavaScriptから始めるプログラミング2016」の第二回のスライドです 今回はCSSの入門を主に行います
2016年度の京大マイコンクラブ(KMC)の新入生プロジェクトである「JavaScriptから始めるプログラミング2016」の第二回のスライドです 今回はCSSの入門を主に行います
ECMAScript 6(2015年6月に公開され、今もなお比較的新しい JavaScript)の大目玉である イテレータ と ジェネレータ。なかなかに複雑で巨大な仕組みになっていてややこしいです。 そこで今回は ジェネレータ を、順を追って理解できるように解説したいと思います。 Qiita: JavaScript の イテレータ を極める! ←こちらから読むのがオススメです Qiita: JavaScript の ジェネレータ を極める!(この記事) また、実用的なサンプルを「3. 実用サンプル」に示しました。 初めにこちらを見て、何ができるのかを知ってから読み始めるのもオススメです。 (2017年3月現在、オープンなページでの使用はまだ避けたほうがいいかもしれませんが、実装は確実に進んでいます。ECMAScript 6 compatibility table) 1. ジェネレータ、ジェ
この記事は “A Taste of JavaScript’s New Parallel Primitives” の抄訳です。 まとめ:複数の Worker と共有メモリを利用して、本当の意味で並列アルゴリズムの JavaScript 実装を可能にするために、JavaScript の基本機能を拡張しようとしています。 複数コアを用いた計算 JavaScript (JS) は成熟しました。モダンな Web ページのほとんど全てで、大量の JavaScript が利用され、それらが動作するのは当たり前のことになっています。また JS の適用領域も拡大しています:クライアントサイドでは、Facebook や Lightroom が行っているように画像処理が JavaScript で実装されていますし、Google Docs のようなブラウザで動作するオフィススイートも JS で実装されています。P
Without any modifications, React is really fast as-is. There are, however, a few things that you can do to improve performance. While working at HelloSign, I discovered some quick fixes that made our apps incredibly snappy. With these simple changes, I was able to reduce render time from over 3000 milliseconds to less than 200 milliseconds. Without any modifications, React is really fast as-is. Th
The new IntersectionObserver landed in Chromium about a week ago. I find it pretty awesome and wanted to do a quick run down on it. This new API eliminates a lot of the headaches where you would have to do things like poll the page to determine when a element is visible. For example, I have a tab that is not selected and it contains some widget that needs to size itself. I hacked around it like th
さて、とうとう皆さん待望の Node.js v6.0 がリリースされました!次のLTS候補です。LTSになるのは2016年の10月からの予定です。v6 の LTS 期間は明示化されてないですが、ルールに照らし合わせれば、LTSになってから 2年半がサポート期間なので、おそらく 2019年4月まではサポートされます。 Node v6.0.0 (Current) | Node.js Node.js v6.0 の主な変更点 ES2015 support の改善 module load性能の改善 Buffer API の new Buffer() コンストラクタの廃止 (セキュリティ上の理由から) ES2015 support の改善 やっぱりこれが一番大きな変化ですね。 node.green を見てもらえればわかるかもしれませんが、 ES2015 のサポートがこれまでは 58% だったのが 96
去年の夏、私たちは大量のコードベース(18,000行以上の コード行数 )をJavaScriptからTypeScriptへと変更しました。この移行作業を通じて、両者の相違点や類似点について大いに学び、TypeScriptの優れたユースケースや、TypeScriptを使うべきではないケースなどについて考えてみました。 型システムとは補助輪のようなものです。転倒防止してくれる代わりに、遅くなり、操作性が制限されます。 TypeScriptのユースケース コードサイズ :ソースコードが膨大である場合、また複数の人がプロジェクトに従事している場合、型システムは明らかなエラーを防ぐのに役立ちます。 特に SPA の場合は当てはまります。誰かが変更したコードが他の人のコードを破損させてしまう可能性があるなら、何らかの安全機構を持つ方がいいでしょう。TypeScriptの トランスパイラ は明白な誤りを
PromiseやGeneratorのような機構を使ってもなお非同期処理は厄介だ、そしてもっとシンプルで便利な方法があるよ、という話です。前半の議論を元に、後半ではなぜプログラミング言語の作用をモナドで抽象すると便利なのかということの説明をしています。 関数型プログラミング言語は「副作用をなるべく減らすことで安全性を高めた言語」というように説明されることがありますが、すべての式が副作用を持たないという『純粋』関数型プログラミング言語が言語を参照透明にしてモナドを導入するのは決して「副作用はなるべく避けたほうが安全だから」という理由だけではないのです。長いですが、これでも結構削りました。 序盤戦・Promises/Generatorsの光と影 Promises/Generatorsで世界はちょっと平和になる かつてはJavaScriptの非同期処理はコールバック地獄に陥ったり様々なパターンが混
クライアントサイドのJavaScriptでのデータ処理を簡単にするライブラリ「Breeze」を紹介。JSONデータをキャッシュしたり、ODataのクエリ文字列などを利用したデータのソートやページング処理をしたりできる。 最近のWebアプリケーション開発のトレンドの1つとして、クライアントサイドにおけるJavaScriptの重要度が増していることは、特にHTML5やマルチデバイスといったキーワードが飛び交う中で最新のWeb開発に携わる開発者であれば周知の事実であろう。また、多種多様なJavaScriptライブラリが登場する中で、jQueryはもはやデファクト・スタンダードとしてその地位を確固たるものにしており、そのプラグインとして動作するJavaScriptライブラリも非常に多い。もはや、JavaScriptというよりは、jQueryでコードを書くといっても過言ではない状況でもある。 このよ
概要 正規表現でひらがなにマッチさせる場合によく「 /[ぁ-ん]/ 」とするが、これを「 \p 」エスケープ表現を使って、 「 /\p{Block=Hiragana}/u 」のように分かりやすく書けるようにするための新たな仕様がV8で実装された。 基本 文字の分類には様々なものがあり、その分類名nameと、その分類での値valueを使って、 「 /\p{name=value}/u 」のように記述する。 hiragana = /^\p{Script=Hiragana}+$/u // スクリプト(言語文字種)分類:平仮名 console.log( hiragana.test( 'あいうえお' ) ) // true console.log( hiragana.test( 'aiueo' ) ) // false // 分類名や値には大抵略称が1つ、または複数設定されており、そちらも使える h
JS しか書いてないんだなって人は筋悪いものをありがたがっていたりする印象はある。しかし筋悪いものをありがたがるみたいなのはどこにでもいるので、JSがどうとかは直接は関係がないはずではあると思う。JSしか書いてない人とPHPしか書いてない人は似たようなもんで、単に広範囲の知識に興味がないだけな気がする。 それはともかく「これは筋悪そうだな」っていう感覚がどこからくるのかよくわかってないので、現時点で思いつく限り雑にメモしておく。 割の合わなさ 「これは何の問題を解決してるんだろう」と思ってドキュメント読んだりソース読んだりした結果、大したことを解決してなくて、その割に実装量が多いとか学習コストが高いと、筋悪いなあと思う。 フットプリントや学習コストに対して提供されるモノが「割に合わない」のは筋が悪く感じる。 将来性のなさ 「あ、これはただの流行だな」みたいな、5年後には消滅してるなというも
Atom は、今注目の最新テキストエディタです。私は、このエディタをソフトウェア開発に使用しているのですが、オープンソースになっているので、少しでも貢献できればとAtomが抱えるIssuesについて検証してみることにしました。私は、 ある奇妙なバグ を見つけました。それは、Atomのユーザ speter がテキストを1行書き、行末で Enter を押した時に起こりました。新たな行が書けるようになるまで、Atomは30分も計算していたのです。私は、そんな単純かつよくあるオペレーションもろくにできないことに大きな衝撃を受け、早速その原因を探ることにしました。 検索 これが、問題のテキストです。 vVar.Type().Name() == "" && vVar.Kind() == reflect.Ptr && vVar.Type().Elem().Name() == "" && vVar.Typ
ネットショップ運営サービス カラーミーショップで「新カゴプロジェクト」と呼んでいる最高のショッピングカートの開発をしている@tsuchikazuです。 2014年に開発を開始した新カゴプロジェクトではフロントエンドをCoffeeScript + Angularで開発してきました。ES5までの時代にAltJS文化を作り、Class構文やArrow Functionを先取りしていたCoffeeScript。それらはES2015(ES6)の仕様に採用され、一方でCoffeeScript自体の開発は止まり、CoffeeScriptは役割を終えたのではないでしょうか。先月、今後も変化し続けるフロントエンドに追従するためにも、新カゴプロジェクトで200ファイル以上のCoffeeScriptをES2015へ移行しましたので、今回その方法を紹介します。 トランスパイラ 移行方法としてCoffeeScrip
https://www.npmjs.com/package/what-do-i-depend-on github.com 先日のleft-pad騒動で、自分のプロジェクトのnode_modulesを慌ててチェックした。 普段依存の依存とかまったく意識してないけど、いざ見なおしてみるとその数の多さにビックリする。 全ての依存を把握するのは正直無理だけど、ざっと見てみるだけでも発見がある。 意外とscoped packageが使われてたり。めちゃくちゃミニマルなパッケージが人気だったり。 babel関係のパッケージが多すぎて目眩がしたり。 というわけで、自分のプロジェクトの依存パッケージを再帰的に調べて、依存度合いをチェックするツールを作った。 node_modules/ 内の package.json を再帰的に調べて、パッケージが登場した回数を表示する。 使い方 インストール npm i
In Promise-based asynchronous code, rejections are used for error handling. One risk is that rejections may get lost, leading to silent failures. For example: function main() { asyncFunc() .then(···) .then(() => console.log('Done!')); } If asyncFunc() rejects the Promise it returns then that rejection will never be handled anywhere. Let’s look at how you can track unhandled rejections in browsers
autoscale: true Read/Write Stack | JavaScriptアーキテクチャ 自己紹介 Name : azu Twitter : @azu_re Website: Web scratch, JSer.info This is Bikeshed.js :bike: 抽象的な話が多いので、実装はコード見て(Pull Request投げて!) これが正しいという話ではないです。 自転車置き場の議論なので! 中規模以上のJavaScript 設計が必要になる 正しい設計はない Bikeshed.js :bike: 人、目的、何を作るかによってアーキテクチャは異なる 前回の続き? : How to work as a Team 用語 設計の目的 中規模以上のウェブアプリ SPAというよりは、画面が複雑なElectronアプリのようなイメージ スケーラブル 人、機能追加、柔
注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日本語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日本語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、本家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く