「webpack」に関連する技術ブログ

企業やコミュニティが発信する「webpack」に関連する技術ブログの一覧です。

2ヶ月でCore Web Vitals, Lighthouseスコアを大幅改善するために行ったこと

こんにちは!!!スマートキャンプでエンジニアをしている吉永です! 自己紹介記事はこちら 前回の記事はこちら 私は現在、スマートキャンプの主力サービスであるBOXIL SaaS(以下、BOXIL)の開発にフロントエンド、バックエンド問わず携わっています。 恐らく新年一発目になる弊社テックブログの記事は私の記事ということで、今年もよろしくお願いいたします。 はじめ

フロントエンド依存ライブラリのバージョンアップ戦略

こんにちは、ISID デジタルビジネス推進室の浦本です。好きな食べ物は生八ツ橋です。 本記事は 電通国際情報サービス Advent Calendar 2021 の24日目の記事です。 はじめに 皆さんは、npmでインストールした依存パッケージを定期的に更新されていますか? 「面倒だから更新していない。。。」 「フロントエンドはそのままでも大丈夫でしょ?」 と思って放置されている方も

私の開発環境2021冬⛄

処方箋情報基盤開発チームエンジニアの加藤です。 この記事は カケハシアドベントカレンダー2021 の18日目の記事になります。 まえがき 今年はとくにアウトプットの速度を求められる局面が多い年でした。 そのため、社内の仕事の速いエンジニア(速い人はビビるぐらい速い)から知恵を借りたり、自身で工夫して開発効率を改善する必要がありました。 その中でも、

ビジュアルリグレッションテストのツールを導入するまでの意思決定プロセス

はじめに この記事はBASE Advent Calendar 2021の15日目の記事です。 BASE株式会社 Owners Experience Frontend チームのパンダ( @Panda_Program )です。 2021年の5月に入社してから、アサインされるプロジェクトの仕事以外に社内 UI コンポーネントライブラリ「BBQ」のメンテナンスに取り組んでいました。 その中でも特に Storybook 周りの整理をする過程、Storybook の v5 から v6 へのバージョン

Docker 環境から webpack-dev-server に繋いで HMR する

BASE Advent Calendar 2021 9日目の記事です。 フリーランスのフロントエンドエンジニア 坪内です。 BASE のお手伝いをさせていただくようになって 1ヶ月が経ち、色々見えるようになってきた中で最も気になっていた点の 1つが、 「 HMR されていない 」 でした。 BASE の Web フロントエンドは webpack でビルドされているのですが、 ローカルの開発環境が Docker 上で動いている事もあ

CommonJS と ESModules が混在している環境で、lodash を lodash-es に置き換え、バンドルサイズを減らす

こんにちは、21卒エンジニアの id:d-kimuson です。 先日、プロダクトで使用している lodash を lodash-es に置き換えることで、バンドルサイズの削減をしました。 lodash を lodash-es に置き換える話はよくありますが、今回のプロダクトは運用歴が長く CommonJS と ESModules が混在している少し特殊な環境での試みだったので、知見を共有したいと思います。 利用されていないコードを

esbuild で開発環境の JS をビルドをしたら 55 倍(220sec->4sec)高速になった件について解説させてください

テクノロジー本部の相馬です。好きな Web API は Window.requestAnimationFrame() です。 私が現在所属しているグループでは、弊社のメイン事業である LIFULL HOME'S における開発効率の改善などを行っています。 私はフロントエンドの開発環境の改善などを主に担当しております。 今回は、LIFULL HOME'S の JavaScript 開発環境のビルドを、esbuild を使ってビルドしたところ、当社比で 55 倍

フロントエンド最新ビルドツールを調べてみた

はじめに まずはwebpack esbuild swc Snowpack Vite まとめ はじめに こんにちは。フロントエンドチームの岡山です。 私の担当するプロジェクトでは現在Vue2を使っており、webpack(vue- cli )を使ってビルドを行っています。 webpack自体は非常に有用なツールではありますが、あえて不満を挙げるならビルドが遅いことでしょう。 キャッシュや処理の並列化など、高速化のためにビルド

GitHub Actions + CircleCI + AWS CodeDeployによるCI/CD環境にインフラを移行した話

スマートキャンプ、エンジニアの入山です。 前回のブログで、弊社プロダクトのインフラをEC2基盤からECS/Fargate基盤へ移行した話を紹介しました。 tech.smartcamp.co.jp 上記プロジェクトは大規模なインフラの刷新だったこともあり、CI/CDについても従来の仕組みからECS/Fargateの構成に合わせて変更しています。 CI/CDは、安定したプロダクト開発には必須且つ長期に渡って継続的

ITCSSを採用して共同開発しやすいCSS設計をZOZOTOWNに導入した話

こんにちは。ZOZOTOWN部フロントエンドチームの菊地( @hiro0218 )です。 2021年3月、ZOZOTOWNは10年ぶりのリニューアルをしました。この記事では、そのリニューアルで再考したCSS設計について紹介します。 背景 今回のリニューアルでは、ウェブとアプリが部分的に共通のデザインになりました。 アプリ ウェブ このデザイン刷新には、CSSの大規模変更が必要です。チーム内で

PostCSSは開発標準ツールになるのか検証しました

こんにちは、株式会社 ラク スで先行技術検証を行っている技術推進課の @t_okkan です。 技術推進課では、新サービス立ち上げ時の開発速度アップを目的に、現在 ラク スでは採用されていない新しい技術の検証を行う、技術推進プロジェクトがあります。 今回はその技術推進プロジェクトで、PostCSSについて検証を行いましたので、その結果の報告を行います。PostCSSの仕

若手エンジニアの俺がフロントエンドのビルドを早くしてReactも導入しちゃった話

またオレ何かやっちゃいました? こんにちは!!!スマートキャンプでエンジニアをしている吉永です! 自己紹介記事はこちら 前回の記事はこちら 弊社の主力サービスであるBOXILはリリースから時間が経っていることもあり、バックエンド・フロントエンドともに様々な技術的負債となる部分を抱えています。 また、その負債の中には普段の業務時間では手をつけにく

フロントエンドの爆速な開発サーバを実現する Vite がバージョン2.0になったので変更点を眺めてみる

こんにちは、スマートキャンプで BALES CLOUD を開発している中川です! 昨年の 9 月に Vue.js のメジャーバージョンが 3 になりかれこれ半年ほど経ちますが、みなさんのプロジェクトでは移行が進んでいますか? 私が普段開発している前述のプロダクトにも Vue.js の 2.x 系を採用しているのですが、利用している UI ライブラリが Vue3 に対応するのを待っている関係でまだ移行

Rails+React環境下における、Hot Module Replacementの導入

はじめに はじめまして。株式会社スタメンでエンジニアをしております、永井( @0906koki )です。 以前の記事 では、筋トレを週5でしていると書いていましたが、今は週2に減らして体をメンテナンスしています。 今回の記事ではRailsとWebpack、そしてReactを使って、webpack_dev_serverによるHot Module Replacement(以下 HMR)を実装する方法について書きたいと思います。 軽くwebpack_dev_se

スタメン開発チーム 2020年の振り返りと来年の展望

スタメンの松谷( @uuushiro )です。2020年3月末にスタメンのCTOに就任し、約9ヶ月ほどが経ちました。色々と変化の大きかったスタメン開発チームの2020年を、私の目線で振り返ります。そして期待も込めて来年の展望を共有したいと思います! どんな2020年だったか 事業について TUNAG まず、創業事業である TUNAG はリリースして今年で4年目でした。TUNAG は、2017年~2019年までは、
技術ブログを絞り込む

TECH PLAY でイベントをはじめよう

グループを作れば、無料で誰でもイベントページが作成できます。情報発信や交流のためのイベントをTECH PLAY で公開してみませんか?