こんにちは、WEAR部の繁谷です。SREとして WEAR の運用・保守・開発をしています。 WEARでは、 以前の記事 で説明した通り、画像配信のリプレイスを行ってきました。本記事ではSRE観点で画像配信のリプレイスや Akamai Image & Video Manager （以下、Image Manager）を利用した画像リサイズの導入の事例を説明します。 techblog.zozo.com WEARにおける画像配信の課題 前述の記事でも紹介している通り、リプレイス前のWEARの画像配信は下図

こんにちは、技術広報の yayawowo です。 Webサイトやブログを作成する際に 「 Twitter や Facebook などのアイコンを表示させたい・・・」 「ここに矢印のアイコンがあれば読みやすいのに・・・」 と思う方がいるのではないのでしょうか？ そんな際にとても便利なのが、 " Font Awesome " です！ 本記事では、Font Awesome の基本知識や使い方だけでなく、カスタマイズ事例も交えてご紹介します。 ※ 利用バージョンについて 　2022年1月現在、Font Aweso

こんにちは。桐生です。久々の投稿となりました。 最近 Next.js + urql + chakra-ui で環境を構築する機会があったのですが、Deno上にも同じような環境が作れないかと思い、Aleph.jsを使っても同じようにやれるのか試してみたので、その内容を共有したいと思います。 そもそも Deno とは？については、以前 ブログ を書きましたので、合わせてご覧ください。 Aleph.jsとは Doc: https://alephjs.org/ GitHub: https://github.com

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

はじめに CTOの川口 ( id:dmnlk ) です。 これはBASE Advent Calendar25日目の記事です。僕は立候補してないのに勝手に日程が組み込まれてました。 BASE株式会社では積極的にエンジニア採用を行っております。 その中でよく質問を頂くのは「BASEに今から入社した場合にやることはあるのか？」というものです。 確かにサービスは成長し上場もしている企業で自分がやることはあるんだろうか、というのは僕も同様に疑問を持つだろうなとは思います。 ですので今回は話せる範囲ではありますが、今

こんにちは。クルーズ株式会社CTOの鈴木です。 今回はFastlyCDNのImage Optimizerを使ってSHOPLIST.comをWebP対応させた話をしたいと思います。 www.fastly.com 背景 背景としては主に二つで、一つ目は画像フォーマットをWebPに対応させることにより通信の トラフィック 量を減らすこと、二つ目はEC2 インスタンス 上にNginxとsmall_lightで構築されているサムネイル生成処理をImage Optimizerに代行させることで、EC2 インスタンス

本記事は NRIネットコム Advent Calendar 2021 22日目の記事です。 🎁 21日目 ▶▶ 本記事 ▶▶ 23日目 🍰 はじめまして、フロントエンドエンジニアの牧と申します。 今回自社サイトのリニューアルをJamstack構成で行ったので、Jamstackとそこで採用したサービスについて書いていきます。 リニューアルの概要について Jamstackとは 今回の採用サービスと採用理由 microCMS（ヘッドレスCMS） Gatsby（静的サイトジェネレーター） Netlify（CDN/

この記事は BASE Advent Calendar 2021 の20日目の記事です。 はじめに こんにちは。Owners Experience Backend Group の杉浦です。主にサーバーサイドのアプリケーションの実装をしています。 エンジニアにとって、外部企業から提供されるAPIやCDN（Content Delivery Network）といった『外部サービス』をどう扱うかは悩ましい問題です。 特にシステムの設計段階において「外部サービスをどうやって内部システムに組み込むのか？」という方針は、

エンジニアの木村です。この記事は Enigmo Advent Calendar 2021 の 13日目の記事です。 いろいろやってますが、BUYチームという購入UXに関わる機能開発を担当するチームのマネージャーもやっています。１１月末に行われる ブラックフライデー 、 サイバーマンデー といった大型キャンペーンに備えた開発もそのチームで担当したのですが、今日はそれに備えて行った負荷対策の１つの取り組みについてお話しします。 悔しい思いをした去年の ブラックフライデー 平素より BUYMA をご利用いただき

これは、 FORCIA Advent Calendar 2021 の12日目の記事です。 はじめに 「CDN」という仕組みをご存知でしょうか。 インターネットを支える縁の下の力持ち的な存在ですが、実際に意識することは少ないかもしれません。 ここでは「CDN」がどのように動いているのか、digコマンドとcurlコマンドを使って理解してみようと思います。 CDNとは 「CDN」とは「content delivery network」の略称でCDN事業者のサーバを経由してコンテンツを配信する仕組みです。 ごく簡

はじめに 「CDN」という仕組みをご存知でしょうか。 インターネットを支える縁の下の力持ち的な存在ですが、実際に意識することは少ないかもしれません。 ここでは「CDN」がどのように動いているのか、digコマンドとcurlコマンドを使って理解してみようと思います。 CDNとは 「CDN」とは「content delivery network」の略称でCDN事業者のサーバを経由してコンテンツを配信する仕組みです。 ごく簡単に図で表すと以下のようなイメージになります。 CDNを使用しないで配信する場合： [ユー

はじめに こんにちは、インフラエンジニアの 高山 です。 この記事は Enigmo Advent Calendar 2021 の 9 日目の記事です。 現在、 BUYMA をオンプレから AWS へ移行するプロジェクトを進めています。 テスト環境の移行は完了し、本番環境の移行をしようというところです。 本番環境の移行をする前に 性能的に問題ないことを確認するため、本番環境と同程度のスペックで検証環境を構築し負荷テストを実施しました。 まだ終わっていませんが、今の時点で得た知見を記事にしようと思います。 負

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

IntstagramやTikTokをはじめ、いまはスマホアプリでも簡単にライブ配信ができる時代。 Ｊストリームでは1997年の創業時から企業向けにライブ配信サービスを提供しているが、そこではライブエンジニアという存在が重要な役割を担っている。今回はライブエンジニアの役割と仕事の魅力、現場でのこだわりについて、ライブに魅了された三人のエンジニアに語ってもらった。 同時14会場、Zoom連携、海外中継… デジタルマーケティングシフトでビジネス向けライブは高度化・複雑化 ―― 今日はライブエンジニア

はじめに こんにちは、SRE部の秋田と鈴木です。ZOZOTOWNのオンプレミスとクラウドの運用・保守・構築に携わっています。 現在、ZOZOTOWNはリプレイスプロジェクトの真っ只中です。そのため、いくつもの壁にぶつかりつつも、それらを1つずつ解決してプロジェクトを進めている状況です。 オンプレミス基盤上で動くWebサーバのリプレイスを行う際に、既存構成では十分なテストを行うことができませんでした。本記事では、その課題をAkamai Application Load Balancerを導入することで解決し