sunderls

sunderls is a front-end engineer

【LINE証券 FrontEnd】Page Stack の進化と課題

こんにちは、sunderlsです。2年前Page Stackについての記事「LINEマンガ:Page Stackを使ってサクサクなページ遷移を実現できました」を出しました。LINE証券でもこのアプローチをとっています。

この記事ではPage Stackはどう進化したのか、どんな課題を抱えているのかを説明します。

コード分割(Code Splitting)を簡単に実装できるgrow-loaderを作った話

はじめに

こんにちは、LINEマンガJavaScript担当の@sunderlsです。

これはLINE Advent Calendar 2017の22日目の記事です。今日は、webpackローダーのgrow-loaderを紹介します。

LINE Engineering Blogの記事「LINEマンガ:Page Stackを使ってサクサクなページ遷移を実現できました」でご紹介しましたが、LINEマンガはWeb技術で実装されています。

Webでネイティブアプリに近いユーザー体験を提供するため、いろいろ工夫しています。今回は、数ある工夫の中からコード分割の実装を紹介したいと思います。

なぜコードを分割するのか

LINEマンガでは、JavaScriptのソースコードをもともと1つのファイルにバンドルしていました。しかしサービスが成長するにつれて、ページ数が増え仕様も複雑になり、バンドル後のファイルサイズがどんどん大きくなってきました。将来を考えると1つにバンドルするのはやはり望ましくないと考え、コード分割の実装を始めました。

LINEマンガ:Page Stackを使ってサクサクなページ遷移を実現できました

はじめに

こんにちは、LINEマンガでJavaScriptを使った開発を担当しているsunderlsです。
LINEの中でマンガを読めるようになったことに、皆さんお気づきでしょうか。


「···」をタップし、「LINEマンガ」アイコンをタップすると、マンガをサクサク読むことができます。