タグ

JavaScriptとfluxに関するikosinのブックマーク (8)

  • yahoo/fluxible による SPA + Server Rendering の概観

    Single Page Application + Server Rendering yahoo/fluxible を使って、Single Page Application と Server Rendering の良いとこ取りのアーキテクチャを目指す。ある程度の複雑性と引き換えに、双方の利点で双方の欠点を打ち消し合うことができるため、全体的には良好なユーザーインタラクションを期待できる構成。 なぜ Single Page Application なのか 画面遷移時するたびにJavaScript/CSS のパースと評価をしなくて良くなる 画面遷移時のトランジションを柔軟に適用できる 画面遷移をまたがった実装が可能になる(あくまで可能になるだけ) なぜ Server Rendering するのか 初期表示の Critical Rendering Path を短縮できる SEO における保守信仰

    yahoo/fluxible による SPA + Server Rendering の概観
  • 歌舞伎座.tech#6「VirtualDOMとReact」 アウトラインメモ

    歌舞伎座.tech#6「VirtualDOMとReact」 - connpass に参加して来たのでメモ。 すべてのCSSに死を!これはJSerの叫び!- @kyo_ago スライド: CSSに死を!これはJSerの叫び! #kbkz_tech CSSが辛い CSSはカプセル化とか継承とか、プログラムからの概念がそのまま持ってこれない ReactStyle js-next/react-style JS内にStyleを埋め込むことができる そのままオブジェクト的に入れられる Template Stringsと合わせればその場でCSSを入れることができる styles=にスタイルを入れる セレクタをあまり考えなくていい style属性でスタイリングする 擬似要素、擬似クラスが全滅 :hover :active などが使えない。 CSSの継承などの概念が消える 自分で頑張る必要がある ユーザプレ

    歌舞伎座.tech#6「VirtualDOMとReact」 アウトラインメモ
  • Ardaの設計指針と設計思想 - Qiita

    @armorik83 さんの記事を受けて Fluxフレームワーク Arda が気になる10の理由 - Qiita 設計思想とか指針とか残しておきます。 mizchi/arda Arda - MetaFluxなフレームワークを作った - Qiita Ardaは実践的なものを目指した 他のフレームワークは思想から入って実装されたものかもしれませんが、ArdaはFluxを意識しつつも実際のアプリで使われている画面遷移の機構を抽象化する点から開発がスタートしています。 またKobitoという比較的寿命が長い(ことを予定している)アプリの基盤にすることで長くメンテされる予定です。なのでKobitoはちゃんと使ってもらえるようなものにしたい、と思って開発しています。(この記事が宣伝兼ねてないとは言いませんが。) (自分の開発したものにしては)ドキュメントが充実していることについて 開発者の今回の様子に

    Ardaの設計指針と設計思想 - Qiita
  • Arda - MetaFluxなフレームワークを作った - Qiita

    僕はIncrements(このQiitaの会社)に入社して以来、KobitoのWindows版を作っていて、その中枢の画面遷移と状態管理をライブラリとして抜き出した。それがArda。 基的には昨日発表した https://speakerdeck.com/mizchi/real-world-virtual-dom というスライドに書いたとおり。 mizchi/arda Ardaの概要 Ardaの目的はFluxの概念をベースに、画面遷移と状態とシーンをベースにしたヒストリ管理、その際のDispatcherのコンテキスト切り替えを行うことを主な目的としている。 CoffeeScriptでの最小構成だと次のようなコードになる Arda = require 'arda' # Arda.Component extends React.Component class HelloComponent ex

    Arda - MetaFluxなフレームワークを作った - Qiita
  • JavaScript フレームワーク - ペパボテックブログ

    フロントエンド周りの技術は驚異的なスピードで進化し、また多様化しています。それらを全てマスターするのは途方もなく大変なので、ペパボでは、社内のエンジニア・デザイナが「最低限これだけはおさえておこう」というスタンダードを文書化することにいたしました。社内向けを想定した文書ではありますが、社内のみに留めず多くの方に役立てたいと考えたため公開します。 この項目の担当 @hadashiA どうしてフレームワークを使う? (1) ドメインロジックとプレゼンテーションの分離 (2) SPA(シングルページアプリケーション) 流行り廃り (1) MVC (2) MVVM (3) Virtual DOM どれを使う? どうしてフレームワークを使う? (1) ドメインロジックとプレゼンテーションの分離 まずこちらの画面を見てください。 ©任天堂 スーパーマリオワールド スーパーマリオが右にダッシュすると、マ

    JavaScript フレームワーク - ペパボテックブログ
  • なぜ仮想DOMという概念が俺達の魂を震えさせるのか - Qiita

    追記: 情報が色々と古くなったため、2020年に書き直した版へのリンクを張っておきます。 この記事は VirtualDOM Advent Calendar 2014 - Qiita の初日です。 初日ということで、基調講演風に、Virtual DOMとはなにか、なぜ僕はこんな興奮しているのか!という話から。 Virtual DOMとはなにか 既存の概念で当てはめると、JavaScriptのMVC, MVW(Whatever)フレームワークのViewに位置します。が、その程度では終わりません。仮想DOMとは世界を革命する力であり、このjQueryのDOM操作で汚れきったフロントエンドを救う救世主なのです。 現時点で自分が知っている限りは、以下の実装を指します。 facebook/react 最も使われてるFacebookの実装 Matt-Esch/virtual-dom Altenative

    なぜ仮想DOMという概念が俺達の魂を震えさせるのか - Qiita
    ikosin
    ikosin 2014/12/01
    “大抵の人間は時系列データをパッチできるぐらいには頭が良くない”
  • Reactive MVC and the Virtual DOMのメモ | GH Issue Note

    Reactive MVC and the Virtual DOM — Futurice のメモ。 Model-View-Intent and the Virtual DOM の記事版という感じ React/Fluxは最近話題になってる React/FluxはリアクティブプログラミングであるがAPIが少し違う Reactはリアクティブとインタラクティブなパターンを混ぜた感じ ゼルダのように昼と夜で同じマップだけど違う世界のように2重となるようなケースを考える The dual of Interactive is Reactive 普通のインラクティブの場合は、Xをに影響を与えるものを探す場合、他のモジュールでX.update()を探す必要がある しかし、リアクティブパターンの場合はXの中を探せば良くなる どうやってリアクティブパターンを実装するか? event emittersの導入 Xから

    Reactive MVC and the Virtual DOMのメモ | GH Issue Note
  • Reactive MVC and the Virtual DOM

    The web frontend scene is witness to many new frameworks and ways of working. It can be quite annoying when software becomes legacy quicker than ever. But actually, it's just good old innovation happening as it should, because the opportunities for improvement are there. Frameworks come and go, but what remains are the good ideas that they brought to the world. We're going to talk about the good i

    Reactive MVC and the Virtual DOM
  • 1