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 における保守信仰
乗るしかない！Reactのビッグウェーブに！─isomorphic tokyo meetupに参加してきた
乗るしかない！Reactのビッグウェーブに！─isomorphic tokyo meetupに参加してきた 白石 俊平（HTML5 Experts.jp編集長） おはようございます。編集長の白石です。 昨日（2015年4月30日）、isomorphic tokyo meetupに参加してきました。 というのも実は近々、HTML5 Experts.jpでは「Webアプリケーション・アーキテクチャ」に関する特集を行う予定なのですが、そこでキーワードとして挙げられていたのがisomorphic。 サーバサイドとクライアントサイドでコードの共有を促進するのが主な目的の一つ、というところまでは理解できたのですが、実際のところ、アーキテクチャはどう変わるのか？ それを探りたいと思っていたところ、ちょうどよくイベントの開催がアナウンスされていたので、急遽取材させていただきました。 取材を快く受け入れてく
Hexi というサイトを作りました (http2study で発表しました。) - from scratch
hexi.pics Hexi というサイトを作ったので紹介です。 What is Hexi Hexagonal Sticker as a Service と僕が勝手に呼んでいるものです。単純に六角形のステッカーを作って、公開して、購入できるECサービスです。 六角形のステッカーって実は標準規格があって、こんな感じになっています。 Stickers Standard この標準規格に合わせて、これ専門のステッカー作れる所作って、勉強会とかで使ってもらったら便利じゃね？と思ったので、友人の会社(絶賛エンジニア募集中)に持ちかけて、自分もバックエンドを基本に空き時間で手伝いながら作りました。 Hexi inside 割りと基本は抑えつつも突っ走った構成をしていて、 nginx (with SPDY) ngx_small_light (画像リサイズ) io.js (v1.6.4 express) A
Node.js＋Socket.IOで作る、通信対戦ができるHTML5ゲームシステムの作り方
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめまして、Yahoo!きっず開発担当です。 昨年Yahoo!きっずにてブラウザオンラインゲーム「おしゃべりリバーシ」をリリースしました。 ※おしゃべりリバーシは2015年10月をもってサービス終了しました。ご利用いただきまして、ありがとうございました。 このゲームは、通信対戦部分の通信プロトコルWebSocketを採用し、サーバミドルウェアにNode.js＋Socket.IOを採用しました。この結果、ブラウザゲームでありながらマルチデバイスでの対戦を実現しました。 今回は、Node.js＋Socket.IOによるWebSocketサーバのシステム構築方法について考慮すべきポイントを、「おしゃべりリバーシ」の実例を紹介しながら説
From AngularJS to React: The Isomorphic Way - RisingStack Engineering
Last week we were working on making our website indexable for search engines. This is the story of rewriting it and the summary of what we have learnt. Background Two months ago when we created RisingStack we had to decide what kind of technologies we wanted to use on our website. We only had a few static pages with some event tracking. So it was very simple, but we wanted to keep it scalable and
#9 Socket.IO
#7 Socket.IO Theme 第9回目のテーマは Socket.IO です。全編英語です。 今回は Socket.IO@1.0 公開を記念して、日本で開催した Socket.IO Meetup で来日した、開発者である @rauchg さんをお迎えし、Socket.IO をテーマに 「Socket.IO を作ったモチベーション」から、「Socket.IO@1.0 での変更点」や「Socket.IO@2.0 の話」などをしました。 ちょうどこの時期にポストされた、彼の同僚であり Express や Mocha の作者である TJ Holowaychuk の、 Farewell Node.js などをネタに、「他の言語で実装した場合」の話などもしました。 今回も Qiita で事前に質問を集め その中のいつくかは紹介しています。質問くださったみなさんありがとうございました。 エピソード
東京Node学園 14時限目で「Synth」について話してきました | Tokyo Otaku Mode Blog
昨夜、渋谷ヒカリエで行われた東京Node学園 14時限目で、トップバッターとして発表してきました。 発表内容は、「Synth」というWebアプリケーションフレームワークについてです。 Tokyo Otaku Modeでは、バックエンドとしてNode.jsとMongoDBを使っていてExpressで運用していますが、色んなフレームワークも触っていてSynthもそのうちの一つです。 SynthはInfoQの「APIファーストのWebフレームワークSynthを巡るコミュニティの困惑」という日本語版記事が出て初めて知った人が多いと思います。 記事にもあるとおり、JSONやテンプレートHTMLを返すAPIとそれを使ってクライアント側でアプリケーションを構築するという形に特化したAPIファーストのWebアプリケーションフレームワークです。 ちょうど上記の記事が出た頃、天下一クライアントサイドJS MV
The way of the substack · GitHub
the-way-of-the-substack.md The way of the substack With over 200 modules in npm, and many such as browserify, dnode, optimist, etc. relied upon day-to-day by developers all around the world, substack is a pretty damn productive guy. Plus, he's got an awesome philosophy on programming to boot (yes, there is a programming philosophy! ... no comprende? Let me explain later). BTW, how do I know this?
Trelloのアーキテクチャ - ワザノバ | wazanova
http://nodeup.com/fiftyfour 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約3時間前 Trelloのアーキテクチャについてのアップデートです。2012年1月にブログで紹介されたものと、昨年11月の最新状況をまとめてみます。 まずは、当初のアーキテクチャ: UIをクライアントサイドで生成し、プッシュでの更新を受け入れるシングルページアプリ。Client/ServerともにJavaScript、2011年5月以降はCoffeeScriptで書いている。 1) The Client TrelloのサーバはHTML、クライアント側のコードをほぼ扱っていない。Trelloのページは2Kのシェルで、一つの圧縮されたJavaScriptファイル（サードパーティのライブラリと圧縮したCoffeeSc
[その2] Groupon: 単一のRailsアプリから複数のNode.jsアプリへの移行 - ワザノバ | wazanova
http://nodeup.com/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約6時間前 「[その1] Groupon: 単一のRailsアプリから複数のNode.jsアプリへの移行」で紹介した取組みについて、Grouponの開発チームがその詳細と最新のテクノロジースタックについて語っています。 Grouponのビジネスは店舗での割引のデイリーディールだけでなく、他の形態のサービス提供（物販、コンサートチケット、体験販売など）にも早めに乗り出していて、トラッフィク的にはそれに対応していたので、Railsでスケーラビリティに関しては実現できていた。Railsからの移行は、どちらかと言うとアーキテクチャ的に、単一の大きなアプリであったことが、機能を追加する際にボトルネックとなっていったから。例えば、サイトのビ
Node.jsをサーバサイドのUIレイヤに限定するのか？ - ワザノバ | wazanova.jp
http://www.nczonline.net/blog/2013/10/07/node-js-and-the-new-web-front-end/ Nicholas ZakasはYahoo出身で現在Boxに勤めるフロントエンジニアで、JavaScriptに関する複数のオライリー本の著者でもあります。彼が自身のブログで、Node.jsをサーバサイドUIレイヤのみで活用することを提言してます。 JavaScriptエンジニアはフロントエンドのコントロールはできるが、サーバサイドのUIレイヤはバックエンドエンジニアの領域で、それがフロント（JavaScript）エンジニアとバックエンドエンジニア双方のストレスであった。（参照図１） Node.jsの登場で、サーバサイドのUIレイヤをサーバサイドのビジネスロジックから分離し、フロントエンジニアはブラウザ & サーバのUIレイヤ、バックエンドエン
Node.js and the new web front-end - Human Who Codes
Posted at October 7, 2013 by Nicholas C. Zakas Tags: Architecture, JavaScript, Node.js, Web Server Front-end engineers have a rather long and complicated history in software engineering. For the longest time, that stuff you sent to the browser was “easy enough” that anyone could do it and there was no real need for specialization. Many claimed that so-called web developers were nothing more than g
東京Node学園#8 Let It Crash!?
ZOZOTOWNで最大級のトラフィックを記録する福袋発売イベントで実施した負荷対策と、当日の監視体制について
Unix Philosophy and Node.js
At TxJS the other day, I gave a talk where I mentioned that the Unix Philosophy is a crucial part of the patterns, opinions, and culture of Node.js. As usual, I made my slides available online well in advance of the talk video being available. For some reason, this brief mention of “Unix Philosophy” set off a few peoples’ ire. Since I had only 25 minutes, and every slide could probably be its own
John Resig - A Strategy for i18n and Node.js
Recently I internationalized a Node/Express web application that I’ve been working on and it seems to have gone fairly well (users in multiple languages are using it happily and I’m seeing a marked increase in traffic because of it!). Not much of what I’m writing up here is particular to Node, per se, just a general strategy for internationalizing a web application. I’ve used enough internationali
Meteor.js - naoyaのはてなダイアリー
http://www.meteor.com/ で公開された Meteor.js を少し触ってみました。TechCrunch なんかでも話題になっていましたね。 Meteor.js は JavaScript によるウェブアプリケーションフレームワークですが、クライアントサイドでもサーバーサイドでもない、"Isomorphic" なフレームワークです。 コンセプトとしていくつか特徴があるのですが、その最たるものは "Reactive Programming" で、モデルやセッションなどのストレージを更新するとその更新内容がリアルタイムに、そのアプリケーションを開いている全クライアントに伝わるようなアプリケーションを簡単に作ることができます。 この辺は実例を見るのが早いです。 http://www.meteor.com/examples/leaderboard ここにある動画では、あるブラウザで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - zertosh/ssr-demo-kit: ssr-demo-kit
http://www.storyboards.jp/viewer/wo41ho
GitHub - npm/ndm: ndm allows you to deploy OS-specific service-wrappers directly from npm-packages.
websocketとイミュータブルインフラ、難しい話 - Togetterまとめ
