CSSアニメーションに入門するのでメモ
りゅうおうのおしごとの空銀子先生の誕生日を調べたら9月9日だったので、何かやりたいと思い、yui540さんが由比ヶ浜結衣の誕生日サイトを作ってたのを思い出した。
これを見て我も作りたい!と思ったので、CSSアニメーションにとりあえず入門するぞい。
とりあえずMDN読んどけばいいだろうということで、ここをヨミヨミしてメモをこれから書きます。
CSS アニメーションの使用 - CSS: カスケーディングスタイルシート | MDN
余談ですが、CSS アニメーションでググるとドキュメントより先にQiitaが出てSEO強っ!って思いました。
CSSアニメーション概要
CSSアニメーションは2種類の要素で構成されている
- アニメーションについて記述するスタイル
- アニメーションの始めとと終わりのCSSスタイルを示すキーフレーム
animationプロパティ
CSSアニメーションの流れを作成するには要素にanimation
プロパティを設定する。
animation
プロパティは外見を指定するのもではなく、アニメーションをどのようにすすめるかを設定するためのものです。
animation
プロパティは値を複数指定して、アニメーションのシーケンスの詳細を指定しますが、それぞれにどのような意味があるのかを覚えるのが大変そうです。
なので、animation-name
やanimation-duration
などのサブプロパティを見て、どのような流れを指定できるのかを知るのが良いと思います。
一つ一つの説明をこのブログで書くのは無駄なので公式ドキュメントをぱぱっと見てください。1分位で読めるかと
キーフレーム
アニメーションの外見を定義しなければ、animationプロパティで指定してきたことを無駄です!なので学んでいきましょう
これは例を見ればどのようなものか分かると思います。 pタグが画面を横切るようなアニメーションです。
p { animation-duration: 3s; animation-name: slidein; } @keyframes slidein { from { margin-left: 100%; width: 300%; } to { margin-left: 0%; width: 100%; } }
これの応用で頑張ればいろいろなアニメーションが表現できるかと思います!
ポートフォリオサイトにアニメーションを組み込んで遊んでみたので良かったら見てください。 https://k-nasa.me/
非同期プログラミング on Rust のために知っときたいこと [メモ]
非同期プログラミング on Rust
このメモは「非同期? なんそれ?」っていう初心者がメモ用で書いたものです。 用語の誤用、誤った記述があると思います。ので、コメントで間違ってるところを教えていただけると嬉しいです。
Rustのstableにasync/awaitがもうすぐ入るようなので、非同期プログラミング,Futureについて勉強していこうと思います。 それのメモがこれです。
非同期プログラミング
非同期プログラミングとは?みたいなところから書いてきます。
非同期プログラミングは複数タスクを経公的に処理(実行)するための技法。
Webサーバーの例でいうと、1つのクライアントとの通信が終わるのを待たずに、他のクライアントの処理を開始する。これが非同期
Future
FutureトレイとはRustの非同期プログラミングの主役的存在です。 jsのPromiseみたいなイメージかな
以下のような定義になってます。
pub trait Future { type Output; fn poll(self: Pin<&mut Self>, cx: &mut Context) -> Poll<Self::Output> } pub enum Poll<T> { Ready(T), Pending } pub struct Context<'a> { /* fields omitted */ } impl<'a> Context<'a> pub fn from_waker(waker: &'a Waker) -> Context<'a>; pub fn waker(&self) -> &'a Waker; } pub struct Waker { /* fields omitted */ } impl Waker { pub fn wake(self); pub fn wake_by_ref(&self); pub fn will_wake(&self, other: &Waker) -> bool; pub unsafe fn from_raw(waker: RawWaker) -> Waker; }
このような実行モデルは、ポーリングモデルと呼ばれています。
具体的には、pollメソッドはself
とコンテキストcx
を受け取り、Poll<Self::Output>
型を返します。
このPollっていうのはReady
とPending
の2つの状態のどちらかを表すことができます。
Ready
バリアントは計算完了を表し、計算結果の値を持ちます。
Pending
は呼んでのごとく、完了していないことを表します。
少し戻りますが、pollの引数が&mut self
ではなくself: Pin<&mut self>
になっています。 これは自己参照構造体を実現するためです。 詳しくはボクも分かってないのでここでは説明できません。雑に記事を貼っておきます。
https://qiita.com/ubnt_intrepid/items/df70da960b21b222d0ad
Poll実行タイミング
Futureの所有者はいつpollを呼び出すのか?という問題があるかと思います。
pollを呼び出してPending
が返ってきたとします。そのようなFutureに対しまたすぐにpollを呼び出すのではCPUを無駄に使用する可能性が高いですね。
なぜなら、Pending
が返ってきているので、計算が終了するまでには、もう少し時間がかかる可能性が高いので。
ここで登場するのが先程しれっと書いたWaker
なのですが詳細な話は省こうと思います。
とりあえずWaker
のwakeメソッドを呼び出すことでランタイムにタスクの再開通知ができます。
まとめ
一旦終わりです。 肝心のAsync/awaitには入ってないですが、基本的なところはこんな感じなので。
あとから、ジェネレーターやAsync/awaitの話を追記しようと思いますが、とりあえずリリースしようぜの精神でpostします。
Y!SUCONのAMIを作成しました
ISUCONに備えて、Yahoo社内ISUCONのY!SUCONを他大学の人とやろうという話になった。
各個人ごとにvagrantで競技用アプリケーション構築をするのも面倒かと思ったのでec2のAMIを作成しました。
以下のAMI IDで検索すると出てくると思います。
AMI ID | |
---|---|
ベンチマーク | ami-03a256e5ccce98822 |
アプリケーション | ami-0086cade13566ce12 |
このとき東京リージョンになっていないとAMIが出てこないので注意を。
ベンチマークの方は起動してそのまま動作するわけじゃないです。 sshで入ってsudo systemctl restart benchmarker
を実行してください。
本当は起動したらすぐ使える状態にするのが良いとは思いますが、めんどくさくってやってません、、、、
アプリケーションの方は大丈夫だと思います。
ベンチやアプリケーションの詳しい説明は公式リポジトリを見てください
GitHub - yahoojapan/yisucon: Yahoo! JAPAN の社内 ISUCON である Y!SUCON です。
では良きISUCONライフを!
アウトプット大全を読んだので感想書く
おすすめされて「アウトプット大全」という本を読みました。
https://www.amazon.co.jp/gp/product/4801400558/ref=ppx_yo_dt_b_asin_title_o00_s00?ie=UTF8&psc=1
この本に、本を読んだら必ずや感想を書くべし!と書いてあったのでカキカキしていきます。
3行で
それぞれのアウトプット(話す、書く、行動する)を伝えやすく、実践しやすくする方法を詰め込んだ本。
具体的には、「え、うまく物事を話して伝えるのが難しい?こうすればええで」、「え?! ブログや日報を書くのがめっちゃ遅い? こうすればええで」のようなテクニックの詰め合わせの本です。
そもそもなぜアウトプットするのか?
この本ではアウトプットとは話す、書く、行動する。といったこのと指しています。
行動する。は今ボクがやっているように、本や映画などから学んだこと、良いなと思ったことを実際にやることです。
そもそもなんでアウトプットするの?という話ですが、ただインプットするだけじゃ記憶として定着しないからです。(当たり前ですが)
じゃあ、なんでアウトプットすると定着しやすいのか?という話になりますが、先程言った3つのアウトプットはいずれも運動神経と筋肉を使う動作です。 これらに関する記憶は運動性記憶と言って、覚えやすく忘れにくいらしいです。 深くは知りませんが。
ちなみに普通に本を読むだけ、暗記するだけは意味記憶を使って記憶しようとするので忘れやすく覚えにくいらしいです。
取り敢えず、忘れるのもったいないしアウトプットしようぜと言うことですね。
どんぐらいアウトプットするのん?
コロンビア大学の心理学者のナントカ・カントカさんがやった実験によると、inとoutの割合は3:7が良いとされています。
実験の詳細は省きますが、暗記テストをやるときに問題を覚える時間と練習する時間の割合をいろいろ変えてスコアを計ったときに3 : 7で行ったグループがスコアが高かったとのこと。
しかし、現代の大学生の平均的はin,out割合は7 : 3ほどらしいです。 理想と逆ですね。
プログラミングの学習が巷で流行ってるそうですが、input過多で手を動かせていない人がたくさんいるのではないでしょうか? (ギクっ!)
おもろ!って思ったところを書く
- 書くことで脳の神経ネットワークが活性化する
へーって思いましたね(小並感)
- 速く文章を書くには前準備が必要
そりゃそうだろって話ですが、文章の構成を考えるだけで、何気なく書き始めるよりも3〜4倍速く書き終わるらしいです。この数字には驚きました。
- TODOリストは紙のがええで
著者いわくTODOリスト3原則というのがあります。
- 紙に書く -> スマホは誘惑が多すぎる
- 目に見えるところに置く -> 次の作業に取り掛かるときにスッと切り替えられるように(TODOリストを確認するという作業を極限まで減らす)
- 豪快に消す -> オワタ!!!!!!という間隔を強めることでドーパミンがでてより頑張るぞい!となるらしい。
まとめ
そんなに、真新しい話はなく、あー知ってる知ってる。という内容が多かったので、そんなにおすすめはしないです。ただ知っていて実践しているかと言われれば、やっていないので、行動に移すいいきっかけにはなったのかな〜と思いました。
これからもこのブログに読んだ本の感想が上がっていくことでしょう!
本題
ここからが本題です!
VTuberの夢月ロアさんを最近押しています。ぜひ見てみてください
おわり〜!