2024-05-29うひょさんに聞く！　React 19アップデートの勘所 #React19_Findy

こんにちは。 マネーフォワード クラウドBox (以下MFCBox)というサービスを開発しています、RailsエンジニアのReoです。 MFCBoxはその名の通りストレージのマイクロサービスなのですが、ファイルの配信方法においてセキュリティと処理の負担軽減を考慮した結果、NGINXの機能である X-Accel-Redirect と AWSの署名バージョン 4 を利用することにしました。 X-Accel-Redirect こちらが、公式ドキュメントの概要説明です。 X-accel allows for internal redirection to a location determined by a header returned from a backend. This allows you to handle authentication, logging or whatever el

Googleが2024年4月3日、新たなJPEGのコーディングライブラリである「Jpegli」を発表しました。Jpegliは高い下位互換性を維持しながら機能が強化されており、高品質の圧縮設定で圧縮率を35％も向上したとのことです。 Introducing Jpegli: A New JPEG Coding Library | Google Open Source Blog https://opensource.googleblog.com/2024/04/introducing-jpegli-new-jpeg-coding-library.html libjxl/lib/jpegli at main · libjxl/libjxl · GitHub https://github.com/libjxl/libjxl/tree/main/lib/jpegli インターネットは人々の生活や仕事に

チームでReactを使って開発していると、コードレビューをする際に、「この書き方はしない方がいいが、それを説明するには800文字くらい必要。図も描きたい。でもそれらを準備する時間はない。」ということが度々ありました。 また、フレームワークやライブラリの技術選定をする際、マネージャに「どうして技術選定が必要なのか」を説明する必要がありました。ROUTE06のマネージャはエンジニアリングへの造詣が深い方が多いので、対立構造になることはありませんが、説明するためには1000文字くらい必要で、やはり図も描きたい。時間はない。と同じ気持ちになることがありました。 参考情報として紹介できる情報がないか探してみると、「とりあえずこうすればOK」というベストプラクティスについては検索エンジンやSNSですぐに見つかります。ただ、どうしてその方法がベストプラクティスなのか、仕組みや原理を説明している情報は少な

このブログエントリでは、テスト駆動開発（TDD: Test-Driven Development）の考案者Kent BeckがTDDの定義を改めて明確化した文章を、許可を得たうえで翻訳し、訳者の考察を沿えています。 きっかけ 2023年の年末、テスト駆動開発（TDD: Test-Driven Development）の考案者Kent Beckは、substackにTDDに関するポストを連投して論戦を繰り広げていました。TDDはその誕生から20年以上が経ち、その間に「意味の希薄化」が発生して議論が噛み合わなくなっていました。意味の希薄化（Semantic Diffusion）とは、新しく作り出された用語が広まる際に本来の意味や定義が弱まって伝わる現象です。 私（和田）はTDDと関わりの深いキャリアを歩んできました。Kent Beckの著書『テスト駆動開発』の翻訳者であることもあり、TDDの正

こんにちは ハタ です。 最近Mirrativ上に構築した配信の文字起こしシステムを紹介したいなと思います 音声からの文字起こしは、各社SaaSでAPI提供されているものがあると思いますが、今回紹介するものはセルフホスト型(自前のGPUマシンを使う)になります 構築していく上で色々試行錯誤したのでそれが紹介できればなと思っています どんなものを作ったか 前提知識: 配信基盤 前提知識: Unix Domain Socket Live Recorder Archiver DS Filter VAD Filter NAC / Compress Transcriber NAC / Decompress Speach To Text コンテナイメージ まとめ We are hiring! どんなものを作ったか 今回作ったものは Mirrativで配信されるすべての音声を対象に文字起こしを行う シス

はじめに こんにちは、株式会社TERASSでエンジニアをしている myrear です。 先日 React Blog にて公開された React Labs: 私達のこれまでの取り組み - 2024年2月版 という記事に React Compiler に関する記述があります。 この React Compiler とは React コードを自動的に最適化し、それにより開発者はメモ化について考える必要がなくなる(忘れることができる)というものです。 まるで魔法のようですが、一体どのような方法でコードの最適化を実現しているのでしょうか？ 本記事では2023年秋の講演の動画を自動翻訳字幕で追いながら要所要所をかいつまんで解説していきます。 React Forget とは？ 先述の通り React コードを自動的に最適化してくれるコンパイラです。 具体的には JavaScript と React のルー

sumirenです。 技術顧問やSREをしています。 背景 2024年現在、OpenTelemetryが盛り上がっており、ベンダへの依存度を下げてテレメトリを収集・送信することがトレンドになってきているように思います。多くの企業様で、OpenTelemetry対応のオブザーバビリティバックエンドを選定されているのではないでしょうか。 一方で、E2E自動テストツールなどもそうですが、デベロッパーツールは画面やUXの情報がパブリックな情報として出回ることが少ないように思います。オブザーバビリティバックエンドの場合、シグナル3種に関してOpenTelemetryベースでもフルに機能が活用できるのかという疑問もあります。 そうしたこともあり、オブザーバビリティバックエンドは実際にトライアルしてみないと選定しづらいです。監視など狭義のオブザーバビリティ外の機能や、OpenTelemetryの範囲外の

NTTドコモ、全国展開する5Gの無線アクセスネットワークをAWSの「Amazon Elastic Kubernetes Service Anywhere」を用いて展開すると発表 NTTドコモとAWSは、NTTドコモが日本全国で商用展開する5Gの無線アクセスネットワーク（Open RAN）を、AWSの Amazon Elastic Kubernetes Service Anywhere（以下、Amazon EKS Anywhere）を用いて展開すると発表しました。 5Gでは、これまで通信キャリアや通信機器ベンダごとに閉じていた基地局などの無線アクセスネットワーク（Radio Access Network）の仕様を、オープンな仕様にすることで、異なるベンダの機器を組み合わせて構築できるできるようにする「Open RAN」（Open Radio Access Network）が急速に進んでいます

SaaS をアーキテクトをするにあたって、どのような事を考えればよいのか？をまとめました。

マイクロサービスとモジュラーモノリスは、どちらかしか選択できないわけではない。ある箇所はマイクロサービス、ある箇所はモジュラーモノリスといったように適材適所で併存させられる。 こうした使い分けをしているのが、会計や人事労務といったバックオフィス系クラウドサービスを提供しているfreee（フリー）だ。基本的には、サービスをまずモジュラーモノリスとして分割し、必要に応じてマイクロサービスを部分的に導入するいう方針を採用している。 2大サービスをモジュラーモノリス化 freeeがモジュラーモノリスの導入を始めたのは2021年。同社には様々なサービスがあるが、「freee会計」と「freee人事労務」が2大サービスだ。これらはいずれもWebアプリケーションフレームワーク「Ruby on Rails（以下、Rails）」で開発されている。 これら2つのサービスのRailsアプリケーションは、いずれも

はじめに こんにちは。ニコニコ動画開発の小池です。 私の所属するチームではニコニコ動画の動画サービスのサーバーサイドをメインに担当しております。 今回は PHPerKaigi2024 向けの記事として、動画サービスのコード改善についてこれまでの歴史や取り組みとその成果について紹介していきたいと思います。 文中の3つのフレーズをチャレンジトークンとしてみました。ぜひ探してみてください! （※ 記事の見出しにの横についている「#」はチャレンジトークンではありません。チャレンジトークンは文中に配置されています。紛らわしくてすみません！） 2006年: ローンチ ニコニコ動画は2006年にローンチされて以来、皆様の応援のおかげで現在までサービスが継続されております。 当時はRuby on Railsが流行り始めてCakePHPが出ているかどうかといったくらいの時代で、フレームワークを利用しないとい

はじめに こんにちは、terandard です。 昨年(2023)のクリスマスに Ruby 3.3.0 のリリースがありました。 リリースノートには「YJIT の大幅なパフォーマンス改善」とあるので、今年の RubyKaigi でも YJIT についての講演があるのかな？とワクワクしております。 弊社のサービスは昨年まで Ruby 3.1 だったため、年始に Ruby 3.2 にアップデートしました。 YJIT も有効化したので、YJIT 有効化前後のパフォーマンス比較について共有します。 YJIT 有効化前後のパフォーマンス確認 リリース前後の1週間のパフォーマンスを比較しました。 グラフに関しては「点線: リリース前」「実線: リリース後」となっています。 リクエスト数 Avg 2.34k → 2.36k 時間ごとのリクエスト数の差はほとんどありませんでした。 従って以降の各指標は Y

なんと、12/02 付けで @tacrew さんが投稿された記事とネタ被りしてしまいました笑 記事をほぼ書いた後に気づいたのですが、ある程度書いていたためこのまま投稿します。 内容は近いですが、req-suit や Storybook を使ってる点は本記事と全く異なる部分になります。 ぜひご参考ください！ GitHubだけでVRTする仕組みを作ってみた #GitHub - Qiita TL;DR 対象 ビルド・デプロイを GitHub Actions で行っている VRT を導入したい しかし Amazon S3 などの外部サービスに依存したくない。 VRT の細かい方法がある程度わかっている（VRT の細かい方法については割愛しています） GitHub Actions のキャッシュにスクリーンショット（スナップショット）を保存することで、外部サービスに依存せずシンプルに VRT を導入す

この記事はファンタアドベントカレンダー2023の2日目の記事です！ 社内で今までVRT（Visual Regression Test）の採用経験がなかったため、VRT環境を一度試してみよう！という話になりました。この際、以下の2点を踏まえてGitHubだけで完結するVRT環境を構築しました。 S3などのストレージが必要ない手軽なインフラ環境で試したい 既存の財産・知見であるStorybookを活用したい 本記事では、その環境構築手順と気づきを共有します。 なお本記事で掲載した一部コードを含む全体をレポジトリで公開しています。 Cybozu Frontend Advent Calendar 2023の12日目にkorosuke613さんも近い内容の記事を公開しています！ GitHub Actions のキャッシュを使った VRT のすゝめ スナップショットをどこに置くかの選択肢およびメリデメ

こんにちは。SmartHRで基本機能を開発しているプロダクトエンジニアの田中です。 私が所属するチームでは、新しくメンバーがジョインした際にチームビルディングのためにムービングモチベーターズを実施しています。 本記事ではムービングモチベーターズの紹介とやってみての感想をお伝えします。 背景 私が所属するチームでは、オンボーディング時はチームビルディングのためにドラッカー風エクササイズを実施していました。 ドラッカー風エクササイズとは、「アジャイルサムライ」の著者Jonathan Rasmussonが提唱したチームビルディングのための手法です。 チームメンバー同士で以下の4つの質問に答えてもらい、お互いの価値観や得意なことなどを知ることができます。 自分は何が得意なのか? 自分はどうやってチームの成果に貢献するつもりか? 自分が大切に思う価値は何か? チームメンバーは自分にどんな成果を期待し

セレンディピティのある推薦、多様性のある推薦、コンテンツ生産者を配慮した推薦など、クリック率の最大化（だけ）を目指さない推薦システムについての紹介です。 連絡先: @joisino_ (Twitter) / https://joisino.net/

import "@typespec/http"; using TypeSpec.Http; model User { id: string; name: string; birthday?: utcDateTime; address: Address; } model Address { street: string; city: string; state: string; zip: string; } @route("/users") interface Users { list(@query limit: int32, @query skip: int32): User[]; create(@body user: User): User; get(@path id: string): User; } openapi: 3.0.0 info: title: (title) versio

BuriKaigi2024 での発表資料です。異なるフレームワークが共存する画面を Micro Frontends のアプローチを用いて部分刷新した事例についてご紹介します Outline/Structure of the Talk 1. BuriKaigi 2023 から 2024 の間に起きた変化 2. Micro Frontends の概要 3. kintone の全画面のヘッダーを刷新するときに生じた問題 4. 選択した結合方法とその理由 5. 得られた効果 6. 刷新した共通ヘッダーの今 Learning Outcome * 大規模なソフトウェアの分割方法・組織アプローチ * Client Side Composition のパターンとそれぞれのメリデメ Target Audience * 大規模なソフトウェアの分割方法・組織アプローチに興味のある方 * Micro Fronte

こんにちは、YOUTRUST Webエンジニアの寺井(YOUTRUST/X)です。 今回は、RuboCopのカスタムコップを使って、YOUTRUST独自の開発ルールの運用を改善した話を書こうと思います。 YOUTRUSTで運用しているルール 先日行われたKaigi on Rails 2023で「Fat Modelを解消するためのCQRSアーキテクチャ」というタイトルで、YOUTRUSTで運用しているCQSアーキテクチャについて発表しました。 speakerdeck.com 発表後、懇親会やブログ記事などで「一般的なRailsの規約ではないYOUTRUST独自のルールをどのようにして運用しているのか？」という質問をいただきました。 しんくうさんのブログ記事より引用 改めて、YOUTRUSTで運用しているCQSに関するルールを簡単に説明すると、更新系において以下のような決まりを設けています。