「爆走できますか?」という問い - 私が歌川です
「困っていますか?」と質問するよりは「順調ですか?」と聞いたほうがいい、という話はけっこう聞くと思うけど、それを更に推し進めることで「爆走できますか?」「爆走できていますか?」というところまで持っていけると思う。 何も困っていること・障害がなく、真に爆走できている状態なら自信を持ってイエスと答えられるだろうけど、実際には何かしらつまずきポイントがあることのほうが多い。そういうときに、どこで詰まるか・詰まりうるか考えたり、みんなで議論したりするのを促進するため、「爆走できる」という状態を最初から理想として持っておいて問いかける。本当に爆走できるならそれに越したことはないだろう。 「爆走」というと全てを無視して最高速で走りつづけるというニュアンスがあるかもしれないけど、本当に全てを無視しているのではなく、取り組みたいことの障害となることが全て解決されている理想形のことを指して「爆走できる」と呼
知見がどんどん集まってくるところが見た〜い - 私が歌川です
はじめに これは はてなエンジニア Advent Calendar 2023 の記事です。昨日の記事は id:onishi さんの ショートカット.app で遊ぶ - 大西ブログ でした。 アプリケーションエンジニアの id:utgwkk です。みなさまは知見に飢えていませんか? 今日は、知見がどんどん集まってくるところを見るために普段から心がけていることについてお話しします。 心がけていること 「サブ会」に出る 「サブ会」というのは以下のような取り組みです (会社のブログから引用しました)。 社内勉強会やはてなグループによる情報共有は日々行っていますが、より集中して取り組み、ときには具体的なタスクを受けもつ、技術的な競争力を持つエンジニアの小集団として（技術グループの）サブ会、というのを設けています。 はてなの技術組織2016 - Hatena Developer Blog 特定の技術分
mockgenのコード生成を1回にまとめて高速化するツールbulkmockgenを作った - 私が歌川です
tl;dr 表題のようなツールを作りました。go install コマンドでただちにインストールできます。 $ go install github.com/utgwkk/bulkmockgen/cmd/bulkmockgen@latest 従来の //go:generate コメントから移行するツールもあります。 $ go install github.com/utgwkk/bulkmockgen/cmd/mockgen-to-bulkmockgen@latest tl;dr 課題感 モックを使った開発と問題 mockgenのコード生成に時間がかかる //go:generate コマンドを1行で書くと人間に優しくない bulkmockgen mockgenから移行する ベンチマーク before (1つずつ生成する) after (まとめて生成する) bulkmockgenの制約 他の方針
linterを導入していなかったプロジェクトにlinterを導入しようとするときにまずやること - 私が歌川です
今どきlinterを使っていないプロジェクトなんて、と思われるあるかもしれませんが、歴史の長いプロジェクトだとそういうこともあるでしょうし、あるいは一部のDSLやスキーマ*1に対してのみlinterを走らせたいということもあるでしょう。 そういったプロジェクトに対してlinterを導入する前に、デフォルト設定でlinterを走らせたときにどういう出力になるのかを一通り眺める、というのをやっています。 どういうエラーがどこで何件出ているのか、warningなのかerrorなのか、linterのルールがプロジェクトにとって妥当なのか、一通り吟味した上で設定を調整してからlinterを導入するようにしています。なぜなら、linterのノイズが多いとlinterの言うことに従うモチベーションが下がる (と自分では思っている) からです。 最初からlinterが入っているなら、とりあえずlinter
DBスキーマからGoのstruct定義を生成するグッズを書いた - 私が歌川です
GoでSQLを書いて実行するとき、素のdatabase/sqlだけだとさすがに心もとないのでsqlxなどのライブラリを使ってDBの行をstructにマッピングすると思います。db struct tagでマッピング元のカラム名を指定できるのが便利ですね。 一方で、このstructを定義する作業ですが、テーブルのカラムが多いと大変だし、typoしていたので直して再チャレンジする……ということが往々にしてあると思います。 こういうときのためにstruct定義を生成するツールを書いてみました。 go install github.com/utgwkk/rowstructgen@latest を実行したら使えるようになると思います。今のところMySQLにしか対応していません (普段はMySQLしか使っていないため)。main.goに全ての実装が書いてあってひどい感じなので、気が向いたらなおします。
詳説「感情がない」 - 私が歌川です
「感情はないです」と発話したり、耳にしたりすることがあると思う。同じ「感情がない」という言葉でもいくつか意味が分かれていそう。 どれでもいい場合 「決めの問題」のパターン。選択肢がいろいろあるけど、思い入れや強く推したい根拠があるわけでもないので、好きに決めてほしい (あるいは決められてほしい) と思っているときの「感情がない」はこれ。とりあえずlinterやformatterを入れたいけど、設定はなんかうまく動くならなんでもいいからよしなに頼む！！ というときもこれになる。 どうでもいい場合 話題に対する興味がとくにないパターン。聞いた話に対して心を動かされることがなくて、そっか～と思ったときはこれに該当すると思う。共感も反対もしていない、無関心であるということを表明している。話を聞くことはできるけど共感は得られないと思いますが大丈夫でしょうか？ と言っている状態で、くまさんデバッグと同
URLにデータを載せつつ、できるだけ短いURLにしたい - 私が歌川です
sugarheart.utgw.net イベント支出記録君は、同人誌即売会などでの支出をすぐに記録するためのツール。プリセットに金額を登録しておけば、ワンボタンで支出を記録することができる。CSVダウンロード、TSV形式でのコピー、URLシェアなど、いろいろな方法でデータをエクスポートできる。 下にあるのは、先日のイベントでの自分の支出記録が確認できるURL。 https://sugarheart.utgw.net/event-expenses-tracker/#3AAtzwAAAYeIkjSMzQH0oM8AAAGHiIwcRM0B9KDPAAABh4iIiQ3NAligzwAAAYeIhB9GzQH0oM8AAAGHiEjof80B9KDPAAABh4hGZ8LNA+igzwAAAYeIRHAXzQH0oM8AAAGHiELJ080B9KDPAAABh4hAf3jNASygzwAAAY
有効期限を過ぎても消えないインメモリキャッシュの謎 - 私が歌川です
tl;dr キーワードは「monotonic clock」です。 あらすじ Goで以下のようなコードを書いていた*1*2。あるAPIを叩くクライアントで、APIコールに必要なアクセストークンを4時間キャッシュしている。c.getToken() で得られたトークンを使ってAPIコールを行えばよい。 type Client struct { mu sync.RWMutex expiresAt time.Time token string } // トークンのキャッシュがあればキャッシュから返し、なければ更新してから返す func (c *Client) getToken() string { if cachedToken, ok := c.getTokenFromCache(); ok { return cachedToken } return c.refreshToken() } // トー
Go Modulesを使いつつgo runで依存モジュールのCLIを実行したときに使われるバージョンは？ - 私が歌川です
Go Modules Reference - The Go Programming Language を流し読みつつ手元でちょっと実験した感じだと、go.modに指定したバージョンになるようだった。 Module-aware commandsの節を見るとそのように読める。 In module-aware mode, the go command uses go.mod files to find versioned dependencies, and it typically loads packages out of the module cache, downloading modules if they are missing. module-awareな場合の go run サブコマンドも、go.modからライブラリのバージョンを特定していそう。 いきなり話題が変わるけど、tool
Recoilとwebpack.DefinePluginと環境変数の名前 - 私が歌川です
これは React Advent Calendar 2022 7日目の記事です。 Recoilを使っているアプリケーションでWebpackのDefinePluginを使って環境変数の値をビルド時に埋め込むとき、Webpackの設定によっては環境変数の名前がビルドしたコードに含まれてしまう場合があります。 具体的には、以下のようにDefinePluginの process.env キーに対してobjectを渡す場合に発生しえます。 new webpack.DefinePlugin({ 'process.env': { FOO: JSON.stringify(process.env.FOO), }, }); ここでRecoilのコードを見てみましょう。ランタイムに process.env の値を参照するコードがあるのに気づくと思います。 github.com optional chaining
ISUCON12 チーム :old_noto_innocent: で予選突破した #isucon - 私が歌川です
今年も id:nonylene id:wass80 と出場しました。最終スコアは50,696点で予選突破できました。分析基盤 (Kibanaやプロファイラ) に流れてきたデータを見つつ作戦を立てて実装する、という流れがうまくはまって順調にチューニングを進められたのがよかったと思います。 最終的なサーバー構成 isuports-1 App (Go) nginx isuports-2 DB (MySQL, player_scoreのみ) isuports-3 DB (MySQL) やったこと リポジトリはこちらです。 github.com 分析基盤まわりの話を id:nonylene が書いてくれたので、こちらもあわせてどうぞ。 nonylene.hatenablog.jp id:wass80 視点の記事もあるので、こちらもあわせてどうぞ。 memo.wass80.xyz テナントごとのDBを
イベントハンドラを設定した要素内にreact-modalのモーダルを置くとイベントハンドラが反応する - 私が歌川です
tl;dr イベントハンドラを設定した要素内にreact-modalのモーダルを置かないようにするのが手っ取り早そう。 イベントハンドラを設定したコンポーネント 以下の Clickable コンポーネントは、divに click イベントのハンドラを設定しており、かつchildrenを取るコンポーネントである。divをクリックするとコンソールにログを出力する。 import { FC, MouseEventHandler, useCallback } from "react"; export const Clickable: FC = ({ children }) => { const handleMouseDown: MouseEventHandler = useCallback((e) => { console.log(`clicked!!!! ${new Date()}`); },
味玉のレシピをMakefileで記述する - 私が歌川です
最近よく味玉を作っているのだけど、ジップロックに日付を記入し忘れたり、ボウルに水を入れてから氷を入れようとしたりしていて、手順の依存関係を意識しないとめちゃくちゃになる。 Makefileは依存関係と成果物を記述できるので、レシピをMakefileの形で書いたらおもしろいのでは、と思ったけど記述量が多い気がする。 .PHONY: お湯を湧かす 卵を茹でる 8分待つ ボウルに氷を入れる ボウルに水を入れる ボウルに卵を入れる 卵の殻を剥く ジップロックに日付を書く ジップロックにめんつゆを入れる ジップロックに卵を入れる 一晩寝かせる 味玉 お湯を湧かす: @echo お湯を湧かします 卵を茹でる: お湯を湧かす @echo 卵を茹でます 8分待つ: 卵を茹でる @echo 8分待ちます ボウルに氷を入れる: 8分待つ @echo ボウルに氷を入れます ボウルに水を入れる: ボウルに氷を入れ
relay-compilerでinline fragmentのある型定義を生成するときのコツ - 私が歌川です
relay-compiler 13.2.0で確認した。つい昨日にRelay 14が出ていたので試してみたけど同様の結果になった。 特定のinterfaceに対するinline fragment内に、interfaceが共通して持つフィールドも都度列挙して書くと、直和型の __typename フィールドによる型の絞り込みが効くようになる。逆に、共通して持つフィールドをinline fragmentの外に書くと、型の絞り込みが効かなくなる。 # OK: __typenameによる絞り込みが効く fragment Foo_bar_ok on Bar { ... on Bar1 { __typename barField bar1Field } ... on Bar2 { __typename barField bar2Field } } # NG: __typenameで型を絞り込めず、bar
吉祥寺.pm 29でトークした #kichijojipm - 私が歌川です
kichijojipm.connpass.com レギュレーションに則って*1一句用意してから臨みました。発表資料は以下です。 speakerdeck.com 自分にとって馴染みのない分野の業務に飛び込むという「挑戦」だったけど、振り返ってみればこれまでと変わらない方法で着実に身につけて知識を展開してきたのではないだろうか、という話をしました。技術的な詳細に触れずに自分なりのノウハウを展開できたと思います。このブログ記事を読んでいる皆様の、新しいことに取り組むときの心がけを教えてほしいです。 今回は「挑戦」がテーマということで、様々なことに挑戦してうまくいった話、うまくいかなかった話などをいろいろ聞くことができてよかったです。こういった発表を見ると、刺激を受けてなにか新しいことに手を出してみたくなります。 *1:リモート開催に句会レギュレーションは適用されるのか？
Webフォントを分割して読み込む際にunicode-rangeを指定しなかったらどうなるのか - 私が歌川です
表題のことについて検証してみましょう。 目次 目次 前提 Webページ上で独自のフォントを読み込むには フォントファイルのサイズ フォントファイルのサイズを抑える工夫 フォントファイルを分割し、必要に応じて読み込む フォントファイルを圧縮する 前提おわり 本題 規格によると 4.5. Character range: the unicode-range descriptor 4.5.1. Using character ranges to define composite fonts 実験する 準備 実験方法 実験結果 まとめ 前提 本題に入る前に、Webフォントを配信する際の前提について説明します。分かっている方は読み飛ばしてもらって大丈夫です。 Webページ上で独自のフォントを読み込むには CSSの font-family 属性に使いたいフォント名を書くことで、Webページ上のコンテン
Next.js Static HTML Export 国際化 最速 無料 - 私が歌川です
はじめに みなさまはNext.jsで静的に生成するHTMLファイルを国際化したくありませんか? Next.jsに組み込みのi18n routingはStatic HTML Exportに対応していないので、別の手を考える必要があります。 結論から言うと、以下の記事にやり方が書いてあります。 dev.to この記事では、Next.jsでStatic HTML Exportで言語ごとのHTMLファイルを生成する方法と、ハマったところを簡単にまとめます。 手順 翻訳データを用意する public/locales/(言語)/common.json に翻訳データを用意します。ラベル→文言というJSONを置けばよいです。 { "hello": "こんにちは" } next-i18nextをインストールする Next.jsでi18next (react-i18next) を使えるようにするライブラリです
relay-compilerが要求する命名規則 - 私が歌川です
はじめに みなさまはrelay-compilerを使っていて以下のようなエラーに遭遇したことはありませんか。私は3000回ぐらいあります。 ERROR: Parse error: Error: RelayFindGraphQLTags: Operation names in graphql tags must be prefixed with the module name and end in "Mutation", "Query", or "Subscription". Got `BarQuery` in module `Foo`. in "components/Foo.tsx" relay-compilerは graphql タグ内に記述したQuery, Mutation, Fragmentの名前に「モジュール名から始まる」「Fragment以外は種類 (Query, Mutatio
「ほたるんの服」の差分はどこにあるのか - 私が歌川です
小ネタです。 仕事してたら気づいた。ほたるんの服、完全にGitHubじゃん。 pic.twitter.com/z0m1UuyuAh— ズッキー (@zukky162) 2021年12月2日 2021/12/3時点での引用リツイートには、どのcommitのどの行かを示したツイートはなかったので、たぶんこれが一番速いと思います。 ほたるんの服のcommit発見した https://t.co/bPH6KcrjtH— うたがわきき (@utgwkk) 2021年12月3日 アタリをつける firefoxArguments などの変数名からブラウザを起動する何かであるということを推測します。devtools や headless などの引数名からこれはpuppeteerのcommitではないか、とアタリをつけました。ここで外すとタイムロスです。 当該の差分を探す GitHubのスクリーンショットから
現状の癖を反映した.perltidyrcとperltidyの令和最新情報 - 私が歌川です
今はそんなに頻繁にPerlを書いているわけではないけど、以下の記事を書いた時点から更新があったのでちょっと書く。 blog.utgw.net .perltidyrc --add-newlines --add-semicolons --add-whitespace --block-brace-tightness=0 --brace-tightness=1 --break-at-old-comma-breakpoints --character-encoding=utf8 --comma-arrow-breakpoints=1 --continuation-indentation=4 --cuddled-else --indent-block-comments --indent-columns=4 --logical-padding --long-block-line-count=1 --ma
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
