JavaScriptの現状を支えるエコシステム群を軽く紹介して、モジュールについて少し掘り下げた勉強会
JavaScriptの現状を支えるエコシステム群を軽く紹介して、モジュールについて少し掘り下げた勉強会
Sift Scienceで製作にReactを使い始めてからほぼ1年になりました。その間、Backbone+Reactという フランケンシュタインのような 複合アプリケーションを、Reactコンポーネントからなる、かなり大きな1つの階層に育て上げました。この記事では、UI不和を最小限にしながら、コードベースをスケーリングするために役立った技法とベストプラクティスを紹介します。また、一般的なコンポーネントのデザインパターンについて、いくつか説明します。 この記事が皆さんの時間の節約と精神衛生の維持に役立ち、UIが複雑になってもReactコードベースの保全性を維持する(破綻するのではなく)ための新しいツールを提供できれば幸いです。 componentDidUpdateで、もっとできる Reactの本質は、DOMの更新というタスクを命令的なものから宣言的なものに変えるということです。他のタイプの命
This blog site has been archived. Go to react.dev/blog to see the recent posts. Today we’re announcing the deprecation of react-tools and JSTransform. As many people have noticed already, React and React Native have both switched their respective build systems to make use of Babel. This replaced JSTransform, the source transformation tool that we wrote at Facebook. JSTransform has been really good
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
#nikkeidenshiban_Sansan の勉強会での発表資料です
ES6から使えるようになるdestructuring assignmentを使って、タプル的に返して受け取れば、複数の値を楽に受け取れるので、エラーハンドリング的なものが楽にできるようになりますよね!という話です。先日書いたライブラリで解決・緩和しようとしていた問題に対する別のアプローチ。 今更言うまでもない、おそらく常識的なテクニックの話なんですが、みんなES6の話をしているのに、こういう使い方の話をロクにしていないので「こういう話しようぜ!」と喧嘩を売る意味で書きました。 let fn = function () { return [ true, // 関数が正常処理できたか or 値の有無とか 100, // 実際の値 ]; }; let [ok, val] = fn(); if (!ok) { return; // 正常処理できていない, 値が特になかったので帰る } まあ、まんま
米ヒューレット・パッカードは、業務アプリケーション向けのJavaScript製UXフレームワーク「Grommet」をオープンソースで公開しました。Grommetは、「コンシューマグレードの機能を備えたエンタープライズ向けのUXフレームワーク」(米HP CTO Martin Flink氏)として開発されたもの。 モバイル対応でカラーパレットやテンプレートなどにより容易にカスタマイズが可能。エンタープライズ向けアプリケーションでよく用いられるカラーパターン、タイポグラフィ、アイコンや、ログイン画面、ダッシュボードなどのパターンが用意されています。
Single Page Application + Server Rendering yahoo/fluxible を使って、Single Page Application と Server Rendering の良いとこ取りのアーキテクチャを目指す。ある程度の複雑性と引き換えに、双方の利点で双方の欠点を打ち消し合うことができるため、全体的には良好なユーザーインタラクションを期待できる構成。 なぜ Single Page Application なのか 画面遷移時するたびにJavaScript/CSS のパースと評価をしなくて良くなる 画面遷移時のトランジションを柔軟に適用できる 画面遷移をまたがった実装が可能になる(あくまで可能になるだけ) なぜ Server Rendering するのか 初期表示の Critical Rendering Path を短縮できる SEO における保守信仰
1 pixel|サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 Ameba Ownd(アメーバオウンド)のフロントエンドエンジニア、五藤(@ygoto3_)です。前々々々回、前々々回に引き続き Ameba Ownd について、今回はフロントエンド開発のお話です。 本エントリーのアジェンダ: はじめに Ameba Ownd は3つのアプリケーションで構成 再利用可能な機能単位でのパッケージング 機能別のパッケージをまとめてモジュール化 複数のアプリケーションで再利用可能な UI コンポーネント作成 機能の独立性が高い大きなモジュールは非同期読み込みでファイル分割 3つのアプリケーションで異なるルーティングの特徴 階
Microsoft Edge では、SIMD(Single Instruction Multiple Data) をサポートしており、うまく活用すると、かなりの高速化が見込めるようです。 news.mynavi.jp ちょうど、JavaScript の 3D グラフィックスライブラリ「Babylon.js」でも v2.1 で SIMD に対応したようなので、サンプルを試してみました。 What’s new in Babylon.js v2.1 - Eternal Coding - HTML5 / JavaScript / 3D development - Site Home - MSDN Blogs Babylon.js による SIMD サンプル Using babylon.js and SIMD.js 不思議な踊りなデモとなっています。MP が吸い取られる可能性があるのでご注意ください
コンポーネント管理できそうなライブラリの選定 ここでいうコンポーネントは HTML 要素をコンポーネントに見立てるような、近代 Web フロントエンドにおける狭義のコンポーネントです。大まかな条件は次の3点。 コンポーネント中心の開発ができること >= IE9 をサポートすること(切っても良さそうなんだけど...) 既製品・スクラッチは問わないが極端なリスクは踏めない(納期がシビア) あとは期待度や API のセンスなど、個人的な審美眼判定に依ります。 angular/angular : 2.0 が正式リリースしたらまた会いましょう jashkenas/backbone : 最近のコンポーネント管理には及ばない Custom Elements ( Polymer ) : polyfill が >= IE10サポート segmentio/deku : 振る舞いは十分だったけど、>= IE10
What's Milkcocoa? Milkcocoaを利用すると、自前でサーバを準備せずに弊社が提供するクライアントSDKを介してデータの保存、更新、取得またPub/Sub通信を行うことが出来ます。通信はTLS暗号化され、保存されたデータは自動的にレプリケーションされます。クライアントからの通信はErlangサーバにて処理され、多くのトランザクションに対応することが出来ます。 例えば以下のコードは、Milkcocoaのデータストアにデータを保存する例です。保存したデータはMilkcocoaの管理画面で確認することができます。データは、Milkcocoaのデータベースに保存されるため、データベース用のサーバーを用意する必要はありません。 var milkcocoa = new MilkCocoa('app_id.mlkcca.com'); var dataStore = milkcocoa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く