こんにちは! Kyoto.js主催の id:amagitakayosi です。
先日開催した ToKyoto.js のレポートをお送りします。
ToKyoto.jsはKyoto.jsの特別編として、メンバーが東京にあつまって開催したイベントです。
アウェイでの開催ということで人が集まるか心配でしたが、蓋を開けてみれば70人を超える方々にご応募いただき、当日は12人が発表を行なうなど、予想外の大盛況となりました!!🎉🎉🎉
会場は白金高輪のKaizen Platformさんのオフィスをお借りしました。
会場設営や入り口での案内など、何から何までお世話になりました、ありがとうございました!🙇🙇🙇
当日の様子はTwitterのハッシュタグ #kyotojsでご覧になれます。
contents
一般発表
ToKyoto.jsのタイムテーブルは、Kyoto.jsメンバーと関東の発表者で 3 on 3 トークバトルという体で組みました。
当日は id:hiroqn が事情により欠席しましたが、なかなかマニアックな発表があつまったのではないかと思います!
「Tasks to release Extension for Edge」pastak
トップバッターは京都から参戦の id:Pasta-K です。
ブラウザ拡張をEdgeに対応しリリースするまでの道のりを紹介してくれました。
Edge向けの拡張機能はまだ64個しか存在しないそうなので、貴重な知見ですね……!
「Vue.js Extend with Compiler」kazupon
2人目は kazupon さんです。
Vue.jsのテンプレートコンパイルの各段階をフックし、様々な拡張を行なう方法を紹介していました。
コンパイラーのフックはvue-loader等で利用されているようですが、他にも色々マジカルな事ができそうですね!
「TypeScript Transformerについてのお話」Quramy
3人目の発表は id:Quramy さん。
TypeScriptのASTを操作してコードをゴニョゴニョできるCustom Transformerについての発表です。
estreeとの互換性が無くて難しいという話ですが、estree周りのツールでもっとTypeScript対応が進むと良いですね……!
「APIs for VJ-ing」amagitakayosi
4人目の発表は僕 id:amagitakayosi です。
最近はAtomでVJできるパッケージを作っているのですが、このパッケージで使っている各種ブラウザAPIを紹介しました。
9/17には実際にこれを使ってVJしたので、またレポート記事を書こうと思います!
「今、我々は、 GUI の設計について 何を考えるべきか」mizchi
発表ラストは id:mizchi さん。
古典的なWebアプリからMVC、Fluxと、フロントエンド開発がGUI開発に近づいていく中で、設計がどう変わってきたかをまとめていました。
最近はNext.jsのようなフレームワークも増えてきたので、SSRやIsomorphicアプリの作成がめっきり簡単になったりと、時代の流れを感じますね……。
LT資料
今回のLTはなんと7人の方が参加くださり、GraphQLからWebVRまで盛りだくさんでした。
LTの順番は忘れてしまったので、順不同で紹介します。
「Data feching and caching on Apollo Client 」joe_re
id:joe-re さんの発表は、GraphQLクライアント実装であるApollo Clientの紹介でした。
Relayとは違い、Apollo Clientは様々なフレームワークや環境から利用できるようです。
fetch, updateといった基本的な操作やページネーションの方法などを、コード例を交えて紹介していました。
「WebVR with Windows Mixed Reality」ikkou
id:ikkou さんは、WebVRの開発方法や、WebVRでどういうことができるのかを紹介していました。
この発表はなんとVRヘッドセットを装着した状態で行われました。
WebVR APIはまだEdgeとFirefoxでしか利用できないようですが、これからの発展が楽しみです!
「IntersectionObserverはいいぞ」Leko
id:leko さんの発表では、DOM要素が画面内にあるかどうかを取得できるIntersectionObserverについて紹介されました。
IntersectionObserverは現在、IE/Safari以外の主要ブラウザですでに利用できるようですね。
スクロールすると固定されるヘッダなど、活用出来る場所を見ない日はないので、早くpolyfillなしで使えるようになりたいものです。
「Ecmascript proposal-realms」brn
brnさんの発表はRealm proposalについての紹介です。
RealmはNode.jsのvmモジュールのように、JSのコードを安全に実行するための仕組みです。
まだあまり知られていないプロポーザルですが、必要とされる業界は多いんでしょうね〜。
「console.animate」katashin
katashinさんの発表では、ブラウザの開発者ツールのコンソールにアニメーションを表示する方法を紹介していました。
Firefoxの開発者ツールのパフォーマンスが良いとのことですが、Firefoxの開発者ツールは他にもDOMの重なりを3Dで見れたり、Web Audio APIのノードの図が見れたりと謎に豪華ですよね……😅
「What I did to improve performance score on Lighthouse」yayoc
yayocさんの発表は、Google製のパフォーマンス測定ツールLighthouseを利用しつつ、アプリケーションのパフォーマンスを改善した話でした。
HTTP/2採用やCode Splitting, IntersectionObserverを利用した遅延ロードなど、色々な施策についてものすごい早足で紹介されていました。
細かい話もじっくり聞いてみたい気がします!
「Nekogata Drum Sequencer written in Scala.js」nkgt_chkonk
LT最後は id:nkgt_chkonk さんでした。
Scala.jsにまつわる様々な困難に直面しながらもScalaを貫き通す姿勢は圧巻でした……。
Scala.jsを試してみてハマった時は、今回の資料をみてみると参考になるのではないでしょうか。
感想 & まとめ
平日の夜開催だったため、懇親会でしっかり会話できるか心配していましたが、Kaizenさんのご厚意により23:30頃までたっぷり議論できました。
(ありがとうございました! > id:axross id:lacolaco id:jmblog)
2次会でもまだまだ盛り上がり、なぜかAM 2:20からLTが行われたりしました。
さすが眠らない街東京……。
今回は、普段のKyoto.jsとはまた違った、色々なコミュニティの話が聞けて最高でした!
ふだん勉強会などに来ないという人も何人かいらしたようで、とても嬉しかったです。
参加者の皆さま、発表者の皆さま、ありがとうございました!!
京都観光の際には、是非Kyoto.jsにいらしてください!
もしまた東京で開催することがあれば……よろしくお願いします🙏🙏