デザインの調整
ずっと中途半端なデザインだなと思っていたので、改めて全体を見直しました。
大きい画像は devicePixelRatio に基いて大きい画像をロードするようなスクリプトを書いていたのですが、面倒なので最近になって常に 2048px の画像を読みこむように変えました。
しかし画面の表示は 960px 程度を最大にしており、Retina でも若干の無駄があるのが気になってきました。ということで、まず 1024px を最大幅にできるようにしました。
しかし、意外ともう少し狭い幅で見ることも多い気がするので (特に開発ツールを横に開いていると結構画面が狭い)、その場合幅だけ変えたバージョンをメディアクエリでだしわけしています。
スマートフォン向けにはさらに狭い幅向けのバージョンをメディアクエリでだしわけていますが、これはほぼ今まで通りです。
また、大きい画面の場合、photo タグが設定されているエントリと、それ以外のエントリで画像の幅を変えるようにしました。tech カテゴリでも無駄に横幅が大きい画像になっていて一画面の情報量が少なかったので、これで見易くなった気がします。
しかし、テキストの幅を制限しつつ画像は大きく表示したいと思うと、自分のデザイン能力だと綺麗にいかず難しく感じます。
関連エントリー
- サイトの画像サイズを再びアップグレード 昨年の4月にデザインの調整ということで、写真の最大サイズを 1024px まで上げていたのですが、これは Google Photos の無料...
- Mac でコマンドラインからユーザ画像を変更する ログイン画面のユーザ画像はディレクトリサービスエントリに保存されている。これはコマンドラインでは dscl / dsimport などで操作...
- 日記のスタイルを微妙に変更 スマフォで見たとき、ファーストビューがあまりにダサすぎたのでヘッダ部分をちょっとマシにしました。 日記のタイトル部分は SVG にしてみまし...
- サーマルカメラ UNI-T UTi260B の画像から文字を消す UTi260B はなぜか表示されている文字を消す機能がない。常に時計やバッテリー表示などを含めてコピーされる。これが邪魔なので消したい。 ス...
- JavaScript の必要ないソーシャルボタン JSなしのソーシャルボタンというのを作ってみました。このサイトの各エントリ下部に実装されているものです。 動機 各サービス、JS を読みこん...
STM32F103 C8 T6 の安いボードでLチカ (platformio + mbed)
STM32F103 C8 T6 の安いボードが ebay で売っているので買ってみました。水晶が実装済み基板が 300円程度。届いたボードに実装済みの外部水晶は8MHz (内蔵RCと周波数は一緒) のようです。また 32.768k の水晶もついています。他に実装されているのはLDOやUSBコネクタぐらいです。
なお USB デバイスを作りたい場合 RC オシレータだとクロック精度が足りないので外部水晶は必須です。
買ったのはこれです: http://www.ebay.com/itm/201529768817
型番について
- STM32F103 シリーズ
- STM32F103C8
- リファレンスマニュアル
STM32F103 C8 T6 という型番の読みかた
- C: 48pins
- 8: 64kbytes Flash
- T: LQFP パッケージ
- 6: -40〜85°C
をあらわしています。STM32F103x8 (64k) や STM32F103xB (128k) はスペックシート共通になっています。 (ピン数とFlashのサイズの違いのみなので)
特徴
以下個人的に良さそうと思った点です。
- STM32F103 は USB 1.1 FS (フルスピード=12Mbps) に対応している
- ADC が2つある (チャンネル数は10)
- 同時サンプリングができそう
Cortex-M3 なので M0 よりはパフォーマンスが良さそうです。一方 FPU や DSP 関係の命令 (SIMDとか) は M0 同様ありません。
クロック
SYSCLK (システムクロック) は
- HSI
- High Speed Internal ?
- HSE
- High Speed External ?
- PLL
の3種類のクロックソースがあります。
HSE はさらに HSE バイパスと HSE クリスタルとに別れています。バイパスは発振器のクロックを直接入れるモードです。
PLL のクロックソースにはHSIとHSEがどちらも使えるようになっています。
このボードの場合
8MHz の外部水晶がついてるので、8MHz の HSE を PLL のクロックソースとして 72MHz にします。USB 用のクロックもここから作ることになっています。
- PLL 入力クロックソースは HSE、分周なし
- PLL逓倍を9倍に (8 * 9 = 72MHz)
- USBプリスケーラは1.5に (72MHz / 1.5 = 48MHz)
- APB1 は2分周 (72MHz / 2 = 36MHz)
みたいになりそうです。が、とりあえず mbed 環境で動かしてみるためクロック設定は無視します (mbed 側で 72MHz に適当に設定されます)
書きこみ (Lチカ)
例によって環境を整える部分は platformio でやります。
platformio.ini は以下のようにします。nucleo_f103rb は型番違いですが、ほぼほぼ互換性があります。nucleo_f103rb の外部水晶も 8MHz のようで、この場合 mbed の初期化コードは一切変更なしでいけそうです。
本来 boards の追加をもっと簡単にできたらいいのですが、現状の platfromio だとそういうことはできなそうです。
# platformio.ini # nucleo_f103rb は f103c8t6 とフラッシュサイズとピン数以外は互換 # 外部クロックも 8MHz で同じのためそのまま使える [env:stm32f103c8t6] platform = ststm32 framework = mbed board = nucleo_f103rb
Lチカはこのようにしました
#include "mbed.h"
DigitalOut led(PC_13);
// Serial serial(USBTX, USBRX);
int main() {
for (;;) {
led = 1;
wait(0.5);
led = 0;
wait(0.5);
}
} PC_13 はボード上のLEDに繋がっています。nucleo_f103rb だと LED1 は PA_5 のようなので、ジェネリック名ではなくピン名で直接指定しています。
書きこみはこれまた ebay で購入した st-link2 を使いました (約400円)。Mac の USB ポートに繋ぐと特に何もしなくても認識するようでした。
ボードと st-link を接続して、USB 接続すると、基板上にも電源供給されます (別途電源供給はいらないようです)
書きこむためまず st-util を起動します。platformio で ststm32 環境をセットアップしておくと st-util もインストール済みのため楽です。
$ ~/.platformio/packages/tool-stlink/st-util 2016-04-14T00:48:41 INFO src/stlink-common.c: Loading device parameters.... 2016-04-14T00:48:41 INFO src/stlink-common.c: Device connected is: F1 Medium-density device, id 0x20036410 2016-04-14T00:48:41 INFO src/stlink-common.c: SRAM size: 0x5000 bytes (20 KiB), Flash: 0x10000 bytes (64 KiB) in pages of 1024 bytes 2016-04-14T00:48:41 INFO gdbserver/gdb-server.c: Chip ID is 00000410, Core ID is 1ba01477. 2016-04-14T00:48:41 INFO gdbserver/gdb-server.c: Target voltage is 3254 mV. 2016-04-14T00:48:41 INFO gdbserver/gdb-server.c: Listening at *:4242...
こんな感じで gdb server として立ちあがります。
別のターミナルから gdb server に接続してバイナリを送りこみます。
$ ~/.platformio/packages/toolchain-gccarmnoneeabi/bin/arm-none-eabi-gdb .pioenvs/stm32f103c8t6/firmware.elf > target extended-remote localhost:4242 > load > cont
これでLチカできました。
ref
- USB サンプル
- mbed の初期化コード
- mbed-src/targets/cmsis/TARGET_STM/TARGET_STM32F1/TARGET_NUCLEO_F103RB
- mbed ピン名定義
- mbed/TARGET_NUCLEO_F103RB/TARGET_STM/TARGET_STM32F1/TARGET_NUCLEO_F103RB
関連エントリー
- STM32F401CC の安いボード Type-C コネクタ 25MHz / 32.768 kHz 水晶つき NRST / BOOT ボタン 裏面に WeAct と書いてあった。...
- STM32F103C8 で ChibiOS を使ってみる STM32F103C8 のやっすいボード (bluepill などと呼ばれているらしい) については数年前に書いた STM32F103 C8...
- stm32f0x 書きこみ速度大会 NanoVNA (stm32f07) に対しての書きこみで、どの方法が早いのだろうか?と気になったので試した。対象は 95764bytes ...
- 10MHz GPSDO (そのうち書く) OCXO と GPS 1PPS その3 | tech - 氾濫原 というのを3年前に書いてからやる気をうしなって放置してましたが、STM32...
- STM32F103C8 激安ボード (BluePill) のセルフパワー化 BluePill は VBUS と 5V と書かれた端子が直結しており、5V ピンに給電してセルフパワー化しようとしたときにUSB接続すると...
体調不良
あいかわらず断続的に体調不良。一日会社を休んで寝てたら回復した気がしたが、また腹痛になった。吐き気はしないのでまだマシ。
ここ最近、夜中に子供がうんちしていることがあって、いざ寝ようと思うと寝室がめっちゃ臭い。子供もおそらく胃腸炎を完治してない気がする。食欲はかなりあるみたいだけど、本調子ではないのだろう。
基本的にストレスが多いのだけど、ストレスが多くなると些細なことにイライラしてさらにストレスを増やしてしまう。一方で捌け口が自分の場合ほとんどないので、どうしようもない。
直近で気が重かった仕事が一旦出て、それは良かったのだけど、出たは出たで次は何をするのかと考えると気が重いので、無限に気が重い。
「スケジュール」について考えると気がとても重くなるのだけど、実際に全体のスケジュールを決めてる人は不思議と前工程のスケジュールをさっぱり守らないので、自分が気を揉むようなことではないはずだと思う。一方スケジュールのことを無視して言われたベースでやってると「やってないんですか」みたいなことになって鬱陶しいし、なんかとにかく何をどうしても嫌な気持ちになるしかない感じがする。
保育園のナニカみたいなのが一年たってだいたい終わったんだけど、自分の役職だけまだ仕事があって、とてもだるい。なんか数秒喋るだけのために1時間か2時間拘束されるハメになる。これが終われば終わりだから我慢しよう。それにしても保育園関係のナニカは本当に不愉快だった…… これは本来「無償ボランティア」の範疇にあることだが、それは名ばかりで強制力がある。責任()というやつです。直接子供のためになるならまだしも、クソどうでもいいこと (進級時に先生にお礼をしましょう、みたいなの。個人的には心底どうでもいい) が実際殆どであった。「無償ボランティア」なうえ特にモチベーションもないので、必然的に優先順位は最下位なのだが、やたらごちゃごちゃ言われて本当に辛かった。得るものがほぼないのに時間がとられる、死にたくなるほど割に合わない。保育園のナニカと比べれば普段の仕事は大変良くて、周りの人は会話が通じるし、効率的なやりかたをしようという前提が共有されている。
関連エントリー
- 保育園に行ったら保育園が開いてなかった 二重の意味で(出勤も保育園も)はぁ嫌だなあと思いながら保育園に行ったら、保育園が開いていなかった。意味がわからなかったけどとにかく開いていな...
- ✖ 体調不良とかで結構有給使っている気がしていたが、まだ一昨年の有給を消費していた。しかしジリジリと減ってる気がする……
- 断続的に体調不良 先週火曜日は体調不良で休んだが、子供も熱を出してひきとることになったので、結局完全には休めなかった。 鼻炎と喉がすこし痛いぐらいなので耳鼻科...
- 体調不良 火曜日の午後ぐらいからちょっとダルくて、とはいえすぐさま早退するほどでもない (というか早退を告げて帰宅開始するほうがストレス高い) ので普...
- 体調不良 もうダメだ。 それはともかく、ここ数週間のやる気のなさがひどい、まるっきり趣味のコードも書いていないし、仕事の進捗もおそろしいぐらいにない。...
✖
筋の悪さ
JS しか書いてないんだなって人は筋悪いものをありがたがっていたりする印象はある。しかし筋悪いものをありがたがるみたいなのはどこにでもいるので、JSがどうとかは直接は関係がないはずではあると思う。JSしか書いてない人とPHPしか書いてない人は似たようなもんで、単に広範囲の知識に興味がないだけな気がする。
それはともかく「これは筋悪そうだな」っていう感覚がどこからくるのかよくわかってないので、現時点で思いつく限り雑にメモしておく。
割の合わなさ
「これは何の問題を解決してるんだろう」と思ってドキュメント読んだりソース読んだりした結果、大したことを解決してなくて、その割に実装量が多いとか学習コストが高いと、筋悪いなあと思う。
フットプリントや学習コストに対して提供されるモノが「割に合わない」のは筋が悪く感じる。
将来性のなさ
「あ、これはただの流行だな」みたいな、5年後には消滅してるなというものは筋が悪い。
標準にそういう機能入るよ、みたいなのを全然違うインターフェイスで実装してたりするのとかがあてはまる。標準で議論されている機能なら、ポリフィルにするのが最も将来無駄にならない。
HTTP2 に向けてキャッシュフレンドリーなリソース構成にしていこうな、という昨今で、何でもかんでもパックや!みたいなのも、今はぎりぎりいいかもしれないけど、既に筋悪い感じがする。
プログラムの見方を変えないラッパー
たとえば Promise はコールバックのちょっとしたラッパーぐらいの機能しかないが、プログラムの見方を変えるという重要な役割を持っているので、意味がある。
しかし単にシンタックスシュガー的なものしか提供していないとかで、何もプログラムの見方が変わっていないのにラッパーがかぶさっているのは、ライブラリとしての意味がない。
「プログラムの理解を助ける」という役割はとても重要だけど、そういう視点で作られているライブラリかどうか、それが割に合うかは難しい。
しかし最悪なのは書き手にとってしかメリットがないというもの。特に実装を全て読まないと使えない系は要注意で、そういう書き手のオナニーで変なラッパーが挟まってるみたいなのは読み手がとても苦労する。これはメリットがないというよりも明確に将来にわたって害となる。
ただし実装を全て読まないといけないものが全てだめかというとそういうわけでもない。実装は読まないと危険だけど可読性はあがるので割に合うこともある。
フルスタック
フレームワークのレールから外れた瞬間アホみたいなマジカルコードを書くことになる。レールから脱線すると必ずハマる。そしてフレームワークの枠組み内で収まるようなアプリケーションはない 。
もし使う場合コピペで実装できる以外のことをしないことがポイントで、「ここはこう書きたいんだ!」という自我を捨ててコピペする機械として生きなければならない。
実際のフルスタックというのは検索して出てきたstackoverflowのコピペで全部やりますよという意味で、なんでもできるという意味ではない。
関連エントリー
- JavaScript の必要ないソーシャルボタン JSなしのソーシャルボタンというのを作ってみました。このサイトの各エントリ下部に実装されているものです。 動機 各サービス、JS を読みこん...
- Comlink は iframe 間通信にも使える https://github.com/GoogleChromeLabs/comlink 「Comlink makes WebWorkers ...
- ✖ プログラミングの場合、ウェブ上にほとんど全ての情報があるので、何かを作りたいときにそれを制限する要素が極めて少ない。ほぼ自分の理解力・実装力...
- 最近『メーデー』を見ている メーデー!9:航空機事故の真実と真相 (吹替版) cho45 --- ★ 5.0 / 5.0 cho45 メーデー!10:航空機事故の真実と...
- G-code での切削パスをブラウザでプレビューするやつを書いた http://cho45.stfuawsc.com/GrblServer/browser/gcode-viewer.html GrblSer...
HTTP2 で何をサーバープッシュすべきか
意外と何をプッシュすべきか悩んだのでひとまず現時点での自分の結論をまとめました。
CSS は必ずプッシュ・JSは場合による
サイトの構成によりますが、ページの表示に必要なものは全てプッシュするべきのようです。
- CSS の全て
- ページの根幹に関わるJSの全て
サーバプッシュの目的
まずサーバプッシュの目的を改めて確認しておくと、これはクリティカルレンダリングパスを削減するためです。
クリティカルレンダリングパスについては クリティカル レンダリング パスのパフォーマンスを分析する | Web Fundamentals - Google Developers がわかりやすいです。
サーバープッシュなしの場合 HTML+CSS 構成のページはクリティカルレンダリングパスが必ず2以上になります。つまり最低でもRTTの2倍の時間がページ表示に加算されます。
これをサーバプッシュで行う場合、HTML+CSSを一度に送り返すので、クリティカルレンダリングパスは1になります。
イメージとしてはHTML内の外部CSSが全てインライン style 要素にしてある場合に似ています。ただしサーバプッシュの場合、適切なキャッシュを効かせることができるケースがあるので、インライン style 要素よりも効率的です。
JSをプッシュすべきか
これは場合によると思っています。JSがないとページの表示に致命的な不具合がある場合、サーバープッシュしないと意味がありません。
一方、JS がページのインターフェイスの向上のために使わていて、とりあえずの表示に関係がない場合、JS をプッシュした分、ファーストペイントが遅れます。
そういうわけでなので、JS をプッシュすべきかどうかは場合によるので簡単に決められない気がしています。
理想のサーバープッシュ
理想のサーバープッシュを考えるにあたって、ロードされるリソースの分類をしてみます。
クリティカルリソース (ブロッキングアセッツ)
ファーストペイントのために必要なリソース
- CSS
- ブロックする JS (async/defer のない script 要素)
- HTML
DOMContentLoaded リソース
DOMContentLoaded までに必要なリソース
- defer された script
onload リソース
onload までに必要なリソース
- 画像
- async された script
どうプッシュするか
最終的に必ずロードされるリソースなら、プッシュしてしまっていいはずです (初回ロードの場合)。
- クリティカルリソース
- DOMContentLoaded リソース
- onload リソース
の順に全てプッシュするのが理想そうです。ただ、現時点で任意の順番に優先順位を明確に決めて送信することはできないような気がしてます。
関連エントリー
- Firefox の開発者ツールのほうが HTTP2 でサーバプッシュされたコンテンツがわかりやすい Firefox だと上記のようにリクエストが消滅してタイミングも全てない表示になるみたいです。 Chrome の Network タブだとプ...
- サイトの最適化 HTTP2 化に伴なって、サイト全体の最適化を行ないました 依存の整理 もはや jQuery なしでも簡単に書けそうなスクリプト部分から j...
- しょぼい個人サイトのキャッシュ 殆どアクセスがないサイトは、ファーストアクセスでキャッシュを作るようなサーバサイドキャッシュの戦略が全く意味がないので、バッチで予めキャッシ...
- スケートボード ひたすらプッシュ あいかわらずプッシュを練習している。グーフィースタンスで始めてしまったので右足前が基本になっている。メインスタンスがグーフィーの場合、プッシ...
- JavaScript の必要ないソーシャルボタン JSなしのソーシャルボタンというのを作ってみました。このサイトの各エントリ下部に実装されているものです。 動機 各サービス、JS を読みこん...
プルリクエストを送るときは大抵気が重い。
たとえ明かなバグ修正、すなわちマージされる公算が大きくても、些細なことでケチがついたりする。これがさらに機能追加みたいな「マージしてもしなくても本流には関係ないね」みたいなのは、マージされる公算がさらに低くてさらに気が重い。
まずプルリクエストを送るケースってのは、別にプルリクエストを送りたくてやってるわけではなく、そのプルリクエストに含まれるコードが自分に必要だからやってるに過ぎない。つまり最悪自分のレポジトリに置いておけばいいのだが、本流に取り込まれていれば今後のバージョンアップで機能が壊れることが減る (ついでに他に困ってる人がいたら助かるかもしれないね)。そういう保守的なモチベーションで動いていることであって、元気良くプルリクを送っているわけではない。
そういうわけで、大抵の場合プルリクエストを投げた時点で「XX だ! とか言われてDISられそうだ」とか「コードスタイルがあってない!!とか言われてリジェクトされないか」とか「オレのところだとテストが通らん!とか言われないか」とか気が滅入る妄想に支配され、燃えつきており、あとはもう勝手にしてくれ (コミュニケーションはしたくないぞ) という気分になっている。
最近良くあるのが、プルリクエスト送る前にコミュニケーションしろ!みたいなルールを強いているプロジェクトで、こういうのはほんとどうしようもない。死ぬほど困っているとか、仕事でやるとかじゃないならプルリク送る気がしない。コミュニケーションしたくないからコード書いてプルリクしてんのに、コミュニケーションを強要してくるのはどういうことなのか。かつて github に感じた居心地の良さはここにはない。
関連エントリー
- なぜ今僕がモールスを学習するのか 僕はベースとしてコミュニケーションに興味がある、というのがまずあって、そのためウェブサービスでも CGM 的なサービスが好きだったりするわけ...
- ✖ 自分は自分のルールで生きており、つまりこのルールは道徳ないし宗教なので、他人にどうこう言われるようなものではない。ただ生きてるわけでもなく、...
- curl の Expect: 100-continue を抑制する curl は POST や PUT でリクエストボディの長さが長いなどの特定条件になると、まず Expect: 100-continue を...
- 後姿に惹かれる女子高生を追い越してはならず、モールス以上のコミュニケーションは過剰 なぜヒトはなんどもなんどもあやまちを繰り返すのか
- pcb2gcode へのプルリク ちっちゃな変更を3つほど送った。 add error for positive --zcut by cho45 · Pull Request...
みいつけた!
サボさんいい
「ワンワンパッコロ!キャラともワールド」でワンワンとサボさんが共演する夢の回があって、サボさんがダンソン(バンビーノ)をやっていた。この番組、全体的に子供には難しいネタが多い。改めて見るとお笑いって常識(お約束)を裏切る形のパターンがよくあって、そもそも常識のない子供はいつから笑えるようになるのだろうと思った。
関連エントリー
- 「みいつけた」がおもしろい NHK Eテレの番組はそれぞれ対象年齢が設定されていて、「いないいないばぁ」は0〜2歳、「おかあさんといっしょ」は2〜4歳、「みいつけた」は...
- 最近の子供の様子 殆ど子供の様子を書いてないが、育っている。最近の様子を書いておく 日常生活での意思疎通がかなり可能になった 例えば 「パパ、トイレ行ってもい...
- ✖ 水曜日に体調不良で会社を休んだ。といっても自分は頭痛と身体がだるいというだけで熱はなく、妻が高熱を出したために主に子供の面倒を見る必要があっ...
- 子供用の椅子の買いかえ Stokke ストッケ ベビーチェア ハイチェア 本体 トリップトラップ 食卓 赤ちゃん 椅子 ウォールナットブラウン cho45 Stok...
- チョロQは、ひく時だけ床に押し付けるものだと思っていた 子供のおもちゃのチョロQを見ていて不思議に思ったことがあって調べたので書いておきます。 遊びかたの先入観 チョロQみたいなプルバック式のミニ...
しょぼい個人サイトのキャッシュ
殆どアクセスがないサイトは、ファーストアクセスでキャッシュを作るようなサーバサイドキャッシュの戦略が全く意味がないので、バッチで予めキャッシュを作っておくみたいなことが必要そうだなと思い、そういうスクリプトを書いて流せるようにしました。
特にサイトのHTML頻繁に変えたりしているとしょっちゅうキャッシュの意味がなくなります。要はこれ、blosxom における静的なページ生成とか、MT におけるリビルドみたいなもんです。
関連エントリー
- このサイトのキャッシュ キャッシュの持ちかたを変えて、圧縮 (gzip) して持つように変えた。キャッシュを返すときは gzip ずみのをそのまま返すように。 gz...
- ブログのキャッシュバックエンドの変更 今までは Cache::FileCache によるファイルシステムキャッシュにしていたけど、いくつか問題があって SQLite にかえた フ...
- macOS における parentalcontrolsd の暴走 macOS では parentalcontrolsd というペアレンタルコントロールに関わると思われるプロセスがしょっちゅう暴走してCPUを...
- サイトの最適化 HTTP2 化に伴なって、サイト全体の最適化を行ないました 依存の整理 もはや jQuery なしでも簡単に書けそうなスクリプト部分から j...
- HTTP2 で何をサーバープッシュすべきか 意外と何をプッシュすべきか悩んだのでひとまず現時点での自分の結論をまとめました。 CSS は必ずプッシュ・JSは場合による サイトの構成によ...






