アーカイブ動画の視聴はこちら → https://www.youtube.com/watch?v=Ga8P_buwXnw

本イベントは、複数回にわたりフロントエンド技術の各分野に精通した方をお招きし、フロントエンド領域の技術を網羅的に学ぶことを趣旨として開催いたします。

開催概要

近年その存在がより重要視される開発レイヤーといえば、フロントエンドを思い浮かべる方も多いのではないでしょうか。

変化が早すぎると言われたフロントエンドも今は昔、各フロントエンドフレームワークのユーザーグループやエンジニアリングに力を入れる企業が中心となって、其々の最新技術アップデートや事例の共有がなされてきました。
先導してくれたコミュニティや企業のおかげで、特定の技術やフレームワークを学ぶことは容易となり、だからこそより重要な領域として、フロントエンドはWeb開発において大きな地位を築いています。

ですが、そんな今だからこそ、俯瞰的に、そして統合的に学ぶ場は減少しているのではないでしょうか？
フロントエンド開発は、バックエンドやデザイン、インフラなど、非常にコラボレーションの機会が多く、特定の技術によらない Web そのものへの知識が求められる領域です。
今回 Forkwell は potato4d氏と協力し、いずれのフロントエンド技術でサービス開発する際も必要となる大切な指標や、Web技術全体について学び直すことができる機会として、Front-End Study を設けました。

本イベントでは、それぞれのテーマについて知見を持つ方を複数名お呼びし、参加される皆さまと一緒に、フロントエンドについて考えていきたいと思います。
また、フロントエンド、バックエンドといった技術の垣根なく、現代のWeb開発において求められる技術を学べる総合的な勉強会にできれば幸いです。

本勉強会スケジュール

こんなエンジニアにおすすめ

• フロントエンド技術を網羅的に学びたい方
• フロントエンド技術について自分がどれだけ理解しているのか確認したい方
• 各フレームワーク、プラクティスを技術選定する上で大事な考え方を学びたい方
• 最新のフロントエンド技術トレンドをキャッチアップしたい方

Front-End Study #2 「Performance Tuning in depth(仮)」

基調講演「メタ・パフォーマンスチューニング」

　古川 陽介 氏（@yosuke_furukawa）
　株式会社リクルート シニアソフトウェアエンジニア　Node.js 日本ユーザーグループ代表

▍発表内容について

ウェブフロントエンドのパフォーマンスは一口に言っても、色々あります。インタラクションを高速化する SPA のようなテクニック、CDNを使ったキャッシュを利用するテクニック、Next.js/Nuxt.js を使った SSG/SSR をベースとする初期表示の高速化などなど、様々です。

この Front-End Study #2 はパフォーマンスの勉強会ですが、How-to などのテクニックめいた話だけじゃなく、なぜそれをする必要があるのか、という Why や パフォーマンスを維持し続けるための心構え、育成などのメタな領域にまで渡って話せるといいなと思っています。

また、現時点で使えるメディアの話のみならず、WebAssembly などの今後の話も全体のセッションで話せると幸いです。

セッション1「Web フロントエンドのパフォーマンスと、WebAssembly。期待できることと、できないこと。」

　chikoski 氏（@chikoski）
　WebAssembly Night の主催者

▍発表内容について

WebAssembly はプログラムを記述するためのバイナリフォーマットの一種で、Web ブラウザの上でも動作します。

このように多くの WebAssembly 紹介記事では説明されています。 JavaScript 以外に、もう一つブラウザの上で動くプログラミング言語があるという理解しておけば、概ね間違いではないと思います。

二つのものがある時、その間にはどういう違いがあるのか知りたくなるというのが人情です。 WebAssembly と JavaScript の違いについて語る時、「パフォーマンス」という言葉がよく出るようです。

Web サイトや、Web アプリのパフォーマンス改善に WebAssembly は役立つのでしょうか。役立つとしたら、どう使っていけばいんんでしょうか。 JavaScript ではなく WebAssembly でサイトを作り直した方がいいんでしょうか。

いろんな疑問と、期待を耳にしてきました。それに対して、いつもこのように答えてきました：

「パフォーマンス改善の役には立ちますが、あなたのサイトの抱えている問題に対して有効かどうかはわかりません。 WebAssembly について悩むより、まず解決しやすく効果の高い問題があるのではありませんか？」

このセッションでは、WebAssembly について概観したのち、パフォーマンス改善に WebAssembly が貢献できる部分、そして貢献できない部分について述べます。 個別の問題を深く扱うことはできませんが、WebAssembly の特徴について、いくつかの利用例とともにお話しできれば幸いです。

セッション2「高速なメディアを実現させるための戦略と戦術」

　Ryoma Abe 氏（@arayaryoma）
　日本経済新聞社 日経電子版フロントエンドチーム

▍発表内容について

日経電子版の記事ページのパフォーマンスにとって何より重要なのはCDNによるキャッシュです。 記事単位にSSRした結果をCDN(Fastly)にキャッシュし、エンドユーザーからのリクエストに対し高速にレスポンスをすることがパフォーマンスチューニングの基礎となっています。 このCDNのおかげで、ユーザーがページにアクセスした際高速にコンテンツを表示することができています。

12月初旬にリニューアルした日経電子版の記事ページを題材に、大規模メディアにおけるcacheの取り扱い、より多くのレスポンスにcacheで応答するために私たちが気を使っていること、 またclient sideのアセットをどのように最適化しているかについて、実務的な目線からお話させていただければと思っています。

タイムスケジュール（目安）

※ タイムスケジュールは目安です。完全解散22:00までの間で、より参加者にご満足いただける形で各コンテンツ時間が調整される場合がございます。
※ プログラムは変更となる可能性があります。随時こちらで更新いたします。

参加方法

• 本イベントは YouTube Live を使用してライブ配信いたします。
  • 下記のリンクよりチャンネル登録の上、ライブ配信予定枠のリマインダー設定をお願いします🙇‍♂️
    　　Forkwell【エンジニア向け勉強会チャンネル🤖】
  • ライブ配信終了後、同URLにてアーカイブ動画の公開を予定しております。アーカイブ動画はライブ配信終了後、YouTube側のエンコード処理が終了次第正常に視聴可能となります。処理中は動画が切れていたり音声が再生されないことがございますので、ご承知おきくださいませ。
  • Twitter タイムラインと連動したリアルタイムな参加体験を重視するため、YouTube Liveの後追い再生はできないよう設定しております。
• 投げ銭について
  • Super Chat を用いた投げ銭に取り組む可能性があります。
• Front-End Study では、Koibumi というフィードバックシステムを利用します。
  • 登壇者に対して、リアルタイムで気軽にフィードバックでき、その後は Twitter などのオープンな場での議論での議論も可能です。

登壇者

• 登壇者は、ビデオ会議ツール Zoomを使用いたします。 Zoom をインストールしたPCで、指定されたURLにアクセスするだけで参加することができます。
• 事前リハーサルは当日18:30より Zoom URLにて実施いたします。お手数お掛け致しますがご協力お願いします。 上記日程にて難しい場合は、別途個別でお時間調整させていただけますと幸いです。
• 一般的な勉強会での発表と同じように、スライドを用意して音声で発表を行っていただきます。
• Zoom の画面共有機能を利用し、参加者にスライド画面を配信します。ウィンドウ単位での画面共有が可能なので、他の画面が見られる心配もございません。 PC内臓のマイク・スピーカーまたは外付けのイヤホンマイクを用いて発表することができます。

留意事項

• Forkwell の宣伝をさせていただく時間がございます。予めご了承ください。
• エンジニアの方を対象としたイベントのため、非エンジニアの方のご参加、ならびに同業に属する方の当イベント内でのリクルーティング活動につきましてご遠慮いただいております。
• イベントおよび懇親会の風景を、Forkwellメディア上の記事（イベントレポート）に掲載することがございます。掲載を希望されない方は、当日Zoomチャットまたはイベントページ問い合わせフォームより、掲載希望されない旨をお伝えください。

また、ご参加者の方々が最大限楽しんで頂けるよう、運営サイドで参加にふさわしくないと判断させて頂いた方については、イベント中であろうとご退席をお願いすることがございます。

• 保険、宗教、ネットワークビジネスの勧誘が目的と見られる方
• その他運営サイドで参加が不適切だと判断した方

誠に恐れ入りますが、あらかじめご了承くださいませ。

主催・協力

主催／コミュニティ支援協賛

「成長し続けるエンジニアを支援する」サービスを運営する Forkwell が開催いたします。
ソニー株式会社様の協賛のもと、技術コミュニティへのスポンサー活動を実施しております。

ライブ配信代行

天神放送局様

天神放送局はライブ配信を広めることで「機会格差をなくす」ことをミッションとしたライブ配信ユニットです。
コミュニティイベントが増え続ける中、コンテンツを熱意ある人に届けるために活動しています。

ライブ配信費用スポンサー

株式会社マネーフォワード様

2012年5月の設立以来、個人向けのお金の見える化サービス『マネーフォワード ME』、自動貯金アプリ『しらたま』、バックオフィスSaaS『マネーフォワード クラウド』などを提供するFintech企業。

各回配信スポンサー

#1 Buildサービス推進チーム（伊藤忠テクノソリューションズ株式会社）

Buildサービス推進チームは、デザイン×クラウドネイティブアーキテクチャ×アジャイル開発で日本の新規サービスやプロダクトを企画から実現まで共創しています。デザイナーやエンジニアを主体としたチーム運営を行い、技術やデザインを教え合い高め合うチームであり続けます。

#2 株式会社マネーフォワード

2012年5月の設立以来、個人向けのお金の見える化サービス『マネーフォワード ME』、自動貯金アプリ『しらたま』、バックオフィスSaaS『マネーフォワード クラウド』などを提供するFintech企業。

#3 株式会社LegalForce

LegalForceは、契約書業務をサポートするSaaSを開発している創業4年目のスタートアップです。弊社ではユーザー体験を徹底的に追求した開発を行っており、その一環としてフロントエンド開発にもかなり力を入れています。UIにこだわりたい、アーキテクチャにこだわりたいというエンジニアの方、一緒に仕事しましょう！

#3 株式会社アンドパッド

アンドパッドは、「幸せを築く人を、幸せに。」というミッションを掲げ、業界の人手不足解決、働き方改革を加速させる建設・建築業に特化したクラウド型建設プロジェクト管理サービス「ANDPAD」を提供しています。

#4 READYFOR株式会社

READYFOR株式会社は、「誰もがやりたいことを実現できる世の中をつくる」というビジョンのもと、クラウドファンディングサービス「READYFOR」を運営しています。
技術の力でより多くの「想いの乗ったお金の流れを増やす」ことを目指し、組織の中にエンジニアリングが自然に溶け込んでいる「乳化」を追求しています。

#5 株式会社アジャイルウェア

顧客の仕事を「楽にする」というミッションを実現するため、働き方も「楽に」「自由に」

• 得意なコトに集中！苦手なことはしなくていい
• 好きな時間、場所で働ける（フルフレックス、リモートいつでもOK、withコロナの手当やサポート充実）
• エディタ、ライブラリ、フレームワーク自由
• 上司のいないフラットな組織

#5 LINE Growth Technology株式会社

LINE Growth Technoogyは、LINEのサービスをより多くのユーザーにより深く愛されるように成長させ続けるための ”Growth開発”を担う開発専門子会社として設立されました。LINEグループの中で特定サービスに紐づかない横断的な組織として、サービスの成長過程で生じる課題解決、LINEサービスの競争力を高めるべく取り組んでいます。