業務で役に立つVS Code機能拡張を作ってみた話
By
| 2022.01.21 2022.01.28この記事は UIT 新春 Tech blog 3日目の記事です。
こんにちは。LINE証券のフロントエンドを開発している岩本海童です。
今日は、業務で利用できる便利なVS Codeの機能拡張を作ってみた話をします。
By
| 2022.01.21 2022.01.28証券フロントエンド
By
| 2022.01.21 2022.01.28業務で見つけた！ Conditional Types
By
| 2022.01.20 2022.01.28こんにちは。LINE証券フロントエンドエンジニアの鈴木です。この記事は「UIT 新春 Tech blog」シリーズ2日目の記事です。
LINE証券ではTypeScriptを使用しており、TypeScriptの力を最大限発揮させられるように日々取り組んでいます。そこで、この記事ではLINE証券のプロダクション用コードで実際にConditional Typesが使用された事例をご紹介します。Conditional TypesはTypeScript 2.8で追加された機能で、部分型関係に基づいた型レベルの条件分岐やパターンマッチができる機能です。TypeScriptの機能の中でも高度な部類であり、一部の型に凝ったライブラリや曲芸的な遊びを除いてはなかなか実用例を聞かないものです。
我々が書いたコードでConditional Typesが使われた事例をご紹介することで、皆さんにもConditional Typesを身近に感じていただき、ぜひ自分のプロダクトでも活用機会を探していただきたいと思います。
【LINE証券 FrontEnd】Recoilを使って安全快適な状態管理を手に入れた話
By
| 2021.06.29 2021.07.01こんにちは。LINEフィナンシャル開発センター フロントエンドエンジニアの峯です。
先日新卒としてLINE証券プロジェクトに配属となり、最初のタスクとしてRecoilによる状態管理の導入に取り組みました。
その際、なぜRecoilにしたのか、また本番開発にRecoilを使うにあたって設計に気をつけたことなどを本記事でご紹介しようと思います。
【LINE証券 Frontend】requestIdleCallbackを活用して初期レンダリング時間を約14%削減した話
By
| 2021.02.17 2021.02.17こんにちは。フィナンシャル開発センターの鈴木です。LINE証券のフロントエンドを担当しています。この記事は【LINE証券 FrontEnd】シリーズの4番目の記事です。
最近のWeb Vitalsの隆盛を受けて、LINE証券のフロントエンドでもパフォーマンスの改善に取り組み始めました。およそ2週間ほど改善に取り組んだ結果として、開発環境での計測ではLighthouseのperformanceスコアが従来より30点ほど上昇しました。
パフォーマンス改善のためにさまざまな施策を行いましたが、この記事ではその中でも興味深かったものとして、requestIdleCallbackを活用してLazy Loadingされるコンポーネントの読み込みを遅延し、その結果初期レンダリングにかかる時間を約14%削減できた事例をご紹介します。
【LINE証券 FrontEnd】コンポーネントをカスタムフックで提供してみた
By
| 2020.07.08 2021.06.24こんにちは。フィナンシャル開発センターの鈴木です。LINE証券のフロントエンドを担当しています。
以前の記事でご紹介した通り、LINE証券ではReactを使用しています。React 16.8で導入されたフックの機能は非常に革新的で、特にカスタムフックの概念によってReactにおけるコンポーネント設計は大きく様変わりしました。我々もフック時代のコンポーネント設計を試行錯誤しており、その結果はLINE証券にも反映されています。
この記事では、その中でも我々が最近ハマっている「カスタムフックを通じてコンポーネントを提供する」という、いわば“render hooks”とも言うべき設計パターンを紹介します。
【LINE証券 FrontEnd】Page Stack の進化と課題
By
| 2020.06.19 2021.06.24こんにちは、sunderlsです。2年前Page Stackについての記事「LINEマンガ：Page Stackを使ってサクサクなページ遷移を実現できました」を出しました。LINE証券でもこのアプローチをとっています。
この記事ではPage Stackはどう進化したのか、どんな課題を抱えているのかを説明します。
【LINE証券 FrontEnd】LINE証券フロントエンドの全体像
By
| 2020.06.08 2021.06.24こんにちは。フィナンシャル開発センターWeb開発室の鈴木です。Web開発室は現在「LINE証券」のフロントエンドを担当しています。【LINE証券 FrontEnd】シリーズでは、Web開発室メンバーがLINE証券のフロントエンドにまつわる様々なトピックや、LINE証券の開発中に得た知見をお届けします。今回は第1回ということで、LINE証券フロントエンドの全体像を説明します。LINE証券というアプリがどんな技術で動いているのか、そして技術に対する考え方を知ることで、LINE証券をより身近に感じていただけると幸いです。
