Portals – React
These docs are old and won’t be updated. Go to react.dev for the new React docs. These new documentation pages teach modern React and include live examples: createPortal Portals provide a first-class way to render children into a DOM node that exists outside the DOM hierarchy of the parent component. The first argument (child) is any renderable React child, such as an element, string, or fragment.
React.jsで起こるXSS (advent calendar 12日目の話) - ooooooo_qの日記
[追記]この記事は情報が古めです。Reactで起こるXSSパターンは他にも存在するので、CTFやbug bountyなどの言葉と一緒に検索してみてください。 この記事は脆弱性"&'<<>\ Advent Calendar 2016の13日目の記事です。 前日の記事はnullです。 この記事を見ている皆さんは仮想DOMに魂を震わせられているでしょうか*1、それともjavascriptに疲れてきた頃でしょうか。私はimagemagick関連を調べるのに疲れてきたところです。 React.jsで起こるXSS ここ数年のwebサービスではReact.jsのような仮想DOMを扱うライブラリを使ってhtmlがレンダリングされていることが多いので、典型的なDOM Based XSSなどは少なくなってきたように感じます*2。React.jsを例にすると、JSXがjsに変換されて仮想DOM経由でDOMを組み
React のソースコードを読んでみよう！ - マルシテイア
こんにちは id:amagitakayosi です。 株式会社はてなで主にフロントエンド開発を担当しています。 この記事では React 本体のコードを読んでみます！！ この記事は Reactアドベントカレンダー 2016 の7日目の記事です。 昨日は yutaszk さんで「react-router v4 でFlux アプリケーションをHot Module Replacement する」でした。 目次 はじめに (Kyoto.js の宣伝) 準備 ディレクトリ構造 monorepo Haste Gulp と Grunt コードリーディング react ReactComponent react-dom ReactMount ReactReconciler ReactCompositeComponent ReactDOMComponent まとめ おわりに はじめに (Kyoto.js の宣
さらに多くのことが変化する – Fluxは新しい”WndProc”である | POSTD
たまたま今まで知らなかったという方のために言いますと、ReactはWebプログラミングにおける最先端の新技術です。そのアイデアはシンプルです。それは、Reactの各コンポーネントは、JavaScriptにおいて、ビューを冪等（べきとう）に描画します。ビューは、コンポーネントが内部に保持している少量のステートのみに基づいてレンダリングされます。同じステートにすれば、その状態におけるコンポーネントは常に同じようにレンダリングされます。これは、データが変われば、Reactは その変更のみを ブラウザのDOMに適用できるということでもあり、ページ全体の再レンダリングを省略できます。実際、何かを変更するかどうかという決定は 全て 、コンポーネントの内部状態に完全に左右されます。それが、なぜReactが非常に早いのかという根本的な理由です。 しかし実際のところ、React自体には、変更をどのように 伝
Reactはリアクティブプログラミングなのか? - uehaj's blog
Reactとは 設計をとりもどす Reactでやってみる Elm-HtmlとReactの対応 ReactはFRPか? ReactはFPか? FPとOOPの真の関係 まとめ 追記 Reactとは Reactは、Facebookが開発した、JSのUIフームワークもしくはライブラリです。Reactが提供する中核機能は以下です。 イミュータブルなUIビルダー Virtual DOMによる効率的更新 上記に付随するイベントハンドラ群を編成していくための方法論 React単体ではコールバックの組合せで、Fluxの一部として使用するとオブザーバーパターンで実現 効用は、再利用性と保守性・可読性向上です。特に、Reactで作成した画面部品のコンポーザビリティが高く、細粒度のUI部品利用の発展充実が期待されます。作りは通常のJSクラスライブラリであり、覚えたりすることは多くありません。 設計をとりもどす R
Aerotwist - React + Performance = ?
3 July 2015 React is very popular at the moment, and I can see why: its developer ergonomics are very attractive. JSX and vDOM are really nice to work with, and it certainly enables composability. But, being the performance-minded person that I am, I wanted to test the claims that it's default-fast. 15 min Read Time #react #performance Share Update 7/3/15: I failed to use the minified version of R
React.js に XSS 対策を求めるのは間違っているだろうか
Transcript 1. React.js に XSS 対策を 求めるのは間違っている だろうか #edomaesec 2015 5/30 LT 2. @clariroid 3. くらりど 4. React.js 5. React.js 6. React.js 青い紐 7. React.js • UI を構築する JavaScript ライブラリ 8. React.js • UI を構築する JavaScript ライブラリ • Virtual DOM 9. React.js • UI を構築する JavaScript ライブラリ • Virtual DOM • Component Composable 10. React.js • UI を構築する JavaScript ライブラリ • Virtual DOM • Component Composable • Server-side R
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
2015/05/27にLINE社で行われた、Data Binding JS Nightでの発表内容です。
最速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倍以上速い結果になるのですが、これはちょっと計
ReactのTutorialをArdaで写経してみる - Qiita
※ 3/20 arda 0.13対応 Ardaって Arda Concept Today's Flux is weak at scene transitions. Arda make it simple by router and context (chunk of flux). Context has Flux features and its stack is very simple. •Dispatcher is just EventEmitter •View is just React.Component (with mixin) •Store should be covered by typesafe steps with promise 特徴が挙げられていますが、ざっくり言うとFacebookの提唱するFluxアーキテクチャーのフレームワークの1つ。Reactはこう使うのが良く
React.js 実戦投入への道 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 最近話題のReact.jsですが、実戦投入に当たっては結構重たい選択を迫られることになります。 ざっくり言えば、テンプレートエンジンを捨ててReactしますか?それともReactあきらめますか?という選択です。 本記事ではReactの基本思想とこうした選択肢が生まれてしまう背景を述べるとともに、後半では「どちらもあきらめない」という(若干シミュレーションRPGあるある感のある)第三の方策について案を提示します。 Reactの基本 最初に、Reactの基本的な仕組みについてまとめておきます。 Reactは公式ドキュメントが非常に充実してい
なぜ仮想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ライブラリの「virtual-dom」だけでMV*なビューを書く - Qiita
virtual-domという、（その名の通り）仮想DOMの生成とdiffを行うシンプルなJavaScriptのライブラリがあります。 GitHubのexampleを見るとわかるのですが、このライブラリのみでも、シンプルな形で動的なビューを実現することができます。 このシンプルさがとても魅力的で、実際に使ってみたのですが、 分かったことをまとめたいと思います。 仮想DOMって？ Reactなどで以前から採用されていて、最近流行している感じの 仮想DOM ですが、 重い本物のDOMとは別に、仮想のDOM（ただのJSオブジェクトなので軽い）のツリーを構築する 仮想DOMの構築を状態が変更されるたびに行って、前回の仮想DOMとのdiffをとって実DOMに適用する という形で動的なビューの実現に利用されます。 仮想であるので、ブラウザ上だけではなくサーバーサイドのHTMLレンダリングにも使えます。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SLOBSERVER - L'actualité de Second Life
Real World Virtual DOM
React.js使ってみた