このブログについて

ユリア

こんにちは、私はユリアです。ここは私の個人ブログです。技術、読書、ときどき生活のひとこまを書き留めています。

更新ペース:書きたいことがあるときに書いています。

メモと考えごと。

yulia.com.cn
ホーム概要
2 ページ / 全 2 件
ユリア 10219ee912421f0b ·
position: sticky の落とし穴

今日はレイアウトで1時間はまりました。サイドバーの position: sticky がどうしても効かないのです。

調べたところ、原因は定番でした。祖先要素のどれかに overflow: hidden(auto や scroll でも)を設定すると、sticky はスクロールできるコンテキストを必要とするため効かなくなります。

確認チェックリスト

  1. sticky 要素自身に top(や bottom など)のしきい値があること
  2. 親の連鎖に non-visible な overflow がないこと
  3. 親要素の高さが十分にあること——なければ「貼り付く」余地がない

書き留めておけば、次からは一度で済みます。

ユリア 10219ee912421f0b ·

玄関でまだ迷っていました。雨は強くも弱くもなく、結局行きました。

雨の公園は別世界です。ランニングコースは空いていて、傘を差して歩く人がちらほらいるだけ。5キロ走り終え、靴はびしょ濡れでしたが、意外と気持ちよかったです。

いくつかの気づき:

  • 小雨は走り始めれば気にならない
  • 靴は濡れても家で乾かせばいい
  • 本当に気をつけるのはスマホだけ——防水ポーチに入れる

これからは雨の日でも迷わず行きます。

ユリア 10219ee912421f0b ·
git stash の一歩先

多くの人(かつての自分も)は git stash と git stash pop しか使いません。実はもっとずっと多くのことができます。

見落としがちなコマンド

git stash push -m "wip: ログイン画面をリファクタ" # メモ付きで、後で見分けやすい
git stash list                        # 何があるか見る
git stash show -p stash@{1}           # 差分を見る
git stash apply stash@{2}             # 消さずに適用
git stash drop stash@{0}              # ひとつだけ削除
git stash branch fix/login stash@{1}  # stash から直接ブランチを作る

最後のひとつは救世主です。stash してから別のことを変えてしまったなら、衝突と戦うより stash からブランチを切るほうが早い。

ユリア 10219ee912421f0b ·

ずっと迷った末、ようやくメカニカルキーボードを買いました。

選んだのはリニア軸。音は控えめで、オフィスでも使いやすいです。2週間使った感想:

  • アクチュエーション荷重は思ったより大事。軽すぎると誤入力する
  • キーキャップの高さは打鍵感に大きく影響する。OEM 高が一番合う
  • 音は確かに気持ちいいが、確かにうるさい

買う価値は? 一日に何千語も打つ人にとっては、あります。

ユリア 10219ee912421f0b ·
HTTP キャッシュのメモ

毎回調べてしまうので、必要になるメモを書きました。

2種類のキャッシュ

種類 動作 ヘッダー
強いキャッシュ リクエストせずローカルを使う Cache-Control: max-age=…, Expires
条件付き 変わったかサーバーに問い合わせる ETag / If-None-Match, Last-Modified / If-Modified-Since

実践的な使い方

  • フィンガープリント付きの静的アセット:max-age=31536000, immutable
  • HTML:no-cache(毎回再検証)、またはごく短い max-age
  • 本当にキャッシュしないのは no-store だけ。no-cache は「再検証する」という意味

最大の誤解:no-cache は「キャッシュしない」ではない。

ユリア 10219ee912421f0b ·

窓辺の3株の近況を記録します。

  • ミント:育ちすぎ。すでに2回刈ってレモンミント水にした。刈るほど茂る。
  • 多肉:徒長して茎が伸びてきた。原因は明確で、光不足。一番日当たりのいい場所へ移動して観察中。
  • ポトス:まったく手がかからない。水栽培の根が立派になってきた。

教訓:植物の不調の原因はたいてい光か水。まず肥料に手を出さないこと。

ユリア 10219ee912421f0b ·
TypeScript の型の絞り込みメモ

型の絞り込みは毎日使うのに、どれを選ぶかいつも考えてしまう。

よくある3つの形

// 1. プリミティブ:typeof
function pad(x: string | number) {
  if (typeof x === "string") return x.padStart(8, "0");
  return String(x).padStart(8, "0");
}

// 2. オブジェクトの形:in
function area(s: { r: number } | { w: number; h: number }) {
  if ("r" in s) return Math.PI * s.r ** 2;
  return s.w * s.h;
}

// 3. おすすめ:判別可能なユニオン
type Shape =
  | { kind: "circle"; r: number }
  | { kind: "rect"; w: number; h: number };

判別可能なユニオンを switch と never のフォールバックに組み合わせれば、新しいバリアントを追加したときに未処理をコンパイラが教えてくれる——それが一番の利点です。

ユリア 10219ee912421f0b ·
行き先のない街歩き

土曜の午後、とてもシンプルなことを試しました。外に出て、地図を見ずに、行けるところまで歩く。

見つけたもの:

  • 古いカメラを売る小さな店。店主が一台一台の来歴を教えてくれる
  • 午後だけ開くパン屋の路地。シナモンロールは4時には売り切れる
  • 住宅街の奥にある古本屋。量り売りをしている

普段の歩きは「A から B へ」だけで、街は駅とナビの線に畳まれてしまう。たまに開いてみると、ずっと大きいことに気づく。

これからは月に一度、午後をこの歩き方に使います。

ユリア 10219ee912421f0b ·

このブログは完全に静的です。書いた Markdown がビルド時に HTML になり、デプロイされるのはファイルだけ。なぜ管理画面やコメントを付けないのかとよく聞かれます。

理由

  1. 保守が要らない:データベースがなければバックアップの心配もなく、サーバーがなければセキュリティパッチもない
  2. 速い:ファイルがそのまま配信され、ランタイムが一切ない
  3. 書き続けられる:フローがシンプルなほど、公開の心理的なコストが下がる

コメントは今のところ不要です。何か言いたい人は手紙を書いてください。静的であることは制約ではなく、選択です。

2 ページ / 全 2 件