k3akinoriのブックマーク - はてなブックマーク

2020年度末のCSS総まとめ！有用でオススメな覚えておくべき新仕様をコードと画像付きで解説

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちはお久しぶりです。Web標準黒帯（ヤフー内のスキル任命制度）の岡部和昌（@kzms2）と申します。今回の記事はありがちな「たくさんの良さげなCSSのプロパティなどを羅列してひたすらまとめる」だけではなく以下の考えのもと、まとめた記事です。岡部が「使うケースがある・覚えておくべき」と感じたオススメできる、または有用と判断したCSS 可能な限り2020年からブラウザに実装された、またはこれから実装されるCSS 比較的新しいまたはあまり使われている印象がないCSS 実際のコードや挙動、対応ブラウザを掲載自分目線でみたコメントや使えそうな場面をできる限り丁寧に説明つまり2020年に実装されたものを中心に、有益でオススメでき

k3akinori 2020/12/22

css

リンク

表示速度を飛躍的に向上させるHTML/CSS最新仕様「content-visibility」「Lazy loading」「contain」をコード付き簡単解説

これまではJavaScriptを用いて実装するしかありませんでしたが、ついにimgやiframe要素であればloading="lazy"を付与するだけで、簡単に実装できます。  <img src="pic.png" alt="画像の詳細" loading="lazy">  <iframe src="external.html" loading="lazy"></iframe>画面外では読み込みが発生しないので、必要になった時（画面内に要素が入りそうになった時）に読み込みが発生するのでパフォーマンスが向上します。また画像についてはsrcsetを用いたレスポンシブな画像に対しても指定できますし、picture要素を用いてfallback形式でも記述できます。 <img src="normal.png" srcse

k3akinori 2020/09/08

css
HTML

リンク

今年のうちに対応したい、Node.jsのBufferに潜む危険性

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Node.js言語サポートチームの加藤佑典です。普段はYahoo!ブックストアの開発/運用を主にしています。先日、同じチームの柄澤がNode学園祭 2016の発表でも少し触れていますが、今期から社内でNode.jsの言語サポートチームが発足しました。本日はそのチームメンバー+有志で行っているNode.js Core APIの勉強会で話題になった、Buffer APIの変更点について触れたいと思います。本記事はNode.js v6.9.1 Documentationをベースに書いています。 1. はじめに勉強会は、以下のようにAPIをカテゴリ分けし、基礎的なAPIであるカテゴリー1のものから順に進めています。

k3akinori 2016/12/07

Node.js

リンク

「基本からしっかり身につくAndroidアプリ開発入門」を執筆しました。

はじめまして。森　洋之（もり　ひろゆき）と申します。ヤフーの黒帯制度にて、黒帯Android 技術に任命されています。これからAndroidを学ばれる方にむけて、基本を学ぶための教科書として、「基本からしっかり身につくAndroidアプリ開発入門」を執筆いたしました。ヤフーの書籍「黒帯シリーズ」としては、「本気で始めるiPhoneアプリ作り」、「黒帯エンジニアが教えるプロの技術 Android開発の教科書」に続く、第三弾となります。本書では、Androidアプリ開発について体系的に学ぶために、基本中の基本から解説しています。その上で、知っておいたほうが良い豆知識や発展的な内容を、Tipsやコラムとしてちりばめました。概要しっかりとしたアプリを作り上げ、それを育てていくためには、非常に多岐にわたる知識が求められます。本書では、Androidアプリの開発を始めるためのとっかかりと

k3akinori 2016/07/29

Android
本

リンク

ES6時代のNode.js

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。情報システム本部の伊藤(@koh110)です。社内システムの開発、運用を担当しています。今回、担当しているシステムをNode.js LTS(v4.x)へバージョンアップしました。それに伴い実施したES6対応の中から3つの事例を紹介したいと思います。 varを撲滅しよう arrow functionを使おう callbackを撲滅しよう varを撲滅しよう varをlet, constに置き換えます。基本はconstに置き換えます。メリットは以下の点で、コードの品質向上につながると思います。プログラム中で変更不可である事を明示的に示せる。誤った使い方をした時にバグとして検出される。 varを利用するとブロック

k3akinori 2015/12/04

リンク

Node.js＋Socket.IOで作る、通信対戦ができるHTML5ゲームシステムの作り方

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめまして、Yahoo!きっず開発担当です。昨年Yahoo!きっずにてブラウザオンラインゲーム「おしゃべりリバーシ」をリリースしました。 ※おしゃべりリバーシは2015年10月をもってサービス終了しました。ご利用いただきまして、ありがとうございました。このゲームは、通信対戦部分の通信プロトコルWebSocketを採用し、サーバミドルウェアにNode.js＋Socket.IOを採用しました。この結果、ブラウザゲームでありながらマルチデバイスでの対戦を実現しました。今回は、Node.js＋Socket.IOによるWebSocketサーバのシステム構築方法について考慮すべきポイントを、「おしゃべりリバーシ」の実例を紹介しながら説