こんにちは。ニコニコ生放送生放送フロントエンドシステムセクションのmisuken(GitHub/Twitter)です。 今回は10月に公開したsmart-svgとreact-sass-inlinesvgという2つのSVG表示ライブラリに関して、作成に至った経緯、ライブラリの特徴、工夫したポイント、パフォーマンス等の話をしていきたいと思います。 ライブラリを作成した経緯 これまでのSVGの表示方法 ニコニコ生放送ではこれまで、SVGを表示する際にはreact-inlinesvgというライブラリを使用していました。 react-inlinesvgは<img>のようにsrcにURLを渡して表示するタイプのライブラリです。 SVG要素がDOMに展開されるため、CSSからスタイルを適用できます。 react-inlinesvgのREADMEに書いてある使用例。 import React from '
2022-06-13 Mon ニコニコ生放送のBackend For FrontendsをKubernetesに移行した知見を公開します こんにちは。生放送フロントエンドシステムセクションのHimenon(GitHub/Twitter)です。 ニコニコ生放送のWEBフロントエンドはBackend For Frontendsの構成を取っています。 これらは従来Docker Swarmのクラスター上でコンテナを稼働させてサービスを提供していましたが、今回、Kubernetesへ移行を実施しました。その知見を公開します! ニコニコ生放送 WebフロントエンドのKubernetes移行ハンドブック 2022 PDF版 構成 Kubernetes istio Argo CD Argo Rollouts 稼働実績 2022年の4月の段階ではWebフロントエンドのサーバーはすべてKubernetesで稼
NX-Jikkyo : ニコニコ実況避難所サイバー攻撃で最低7月末まで鯖落ち中のニコニコ実況に代わる避難所です。お気に入りのアプリを使い続けながら、今まで通りテレビを楽しく快適に実況できます。nx-jikkyo.tsukumijima.net GitHub - tsukumijima/NX-Jikkyo: NX-Jikkyo: Nico Nico Jikkyo AlternativeNX-Jikkyo: Nico Nico Jikkyo Alternative. Contribute to tsukumijima/NX-Jikkyo development by creating an account on GitHu...github.com NX-Jikkyo は、サイバー攻撃の影響で 2024/06/08 ~ 08/05 まで鯖落ちしていた ニコニコ実況に代わる、ニコニコ実況民のため
JSer.info #621 - Electron 22.0.0がリリースされました。 Electron 22.0.0 | Electron Chromium 108、Node.js 16.17.1、V8 10.8へのアップデート、UtilityProcessモジュールの追加、new-windowイベントの非推奨化などの変更が含まれています。 また、Chromium 109でWindows 7/8/8.1のサポートが終了するため、Electronもこれに合わせるようです。 そのため、Windows 7/8/8.1をサポートする最後のElectronバージョンとなります。 Sunsetting support for Windows 7 / 8/8.1 in early 2023 - Google Chrome Community 今週はウェブパフォーマンスやJavaScriptのパフォーマ
この記事は第二のドワンゴ Advent Calendar 2019の10日目の記事です。 この記事の概要 Webフロント開発をしている際に、npmライブラリのマイグレーションって結構コストかかるので自動化したいよねって動機の元、そのためのツールとしてDependabotとかRenovateとかあるけど、どっち使うのが良さそうかなという検討をしました。 ただし、あくまでもnpmライブラリの更新という側面からの記事のため、他の言語やパッケージ管理システムからの側面についての検討はされていないことをご留意ください。 また、時間に追われて書きなぐった内容になっていて後で書き直すかもしれませんがご了承いただければと思います。 結論 先に結論だけ書いてしまうと、Github EnterpriseやArtifactoryなどのprivate npm registryを使っている自分たちの環境ではReno
JSer.info #599 - Next.js 12.2がリリースされました。 Blog - Next.js 12.2 | Next.js MiddlewareとOn-Demand ISRのStableな機能となりました。 API RouteとSSRをCloudflare Workersを使ったEdgeで動かすruntimeオプションを追加など。 これに合わせて、Edge Runtimeをローカルでエミュレートするためのedge-runtimeというパッケージが公開されています。 What is Edge Runtime | Edge Runtime そのほかには、next/imageの改善、SWCプラグインのサポート、React 18のサポート改善などが含まれています。 また、next/linkが常に <a> で囲まれるようになる機能をopt-inで導入できるようになっています。 Re
こんにちは。ニコニコ生放送生放送フロントエンドシステムセクションのmisuken(GitHub/Twitter)です。 今回は最近公開したurl-fromというライブラリに関して、作成した動機、安全性、利便性、おすすめの使い方を紹介していこうと思います。 url-fromが一般的なURL生成ライブラリと比較して強みを持っているのは以下の点になります。 パス部分も含め、全体的にエンコードを意識せず使用できる URLの定義と生成を分離できる 細部まで型や警告で保護してくれる 実際の利用シーンに馴染む設計を心がけたため、安全性と利便性と書き味を兼ね備えたライブラリに仕上がっています。 使用してもらったメンバーから「型がサクサク当たるので書いてて楽しい」といった声もあがるくらい、使っていて楽しくなるライブラリでもあります。 url-fromを作った動機 発端 以前からチーム内でURLの生成方法が時
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く