転職しました - console.lealog();
そして子も生まれていました！ というわけで、子です🤗 pic.twitter.com/UzvIiUpCOP— りぃ (@leader22) 2020年6月10日 人生ですなあ。 いままで 2018年12月からNTTコミュニケーションズという会社で働いていて、2020年6月いっぱいで退職しました。（なのでこれはいわゆるNTT退職エントリ 🥱） N社では、 SkyWayの（歴史ある）JS-SDKをメンテしたり （おなじく歴史ある）Nodeで書かれたシグナリングサーバーをメンテしたり OSSのSFUである`mediasoup`を使って、録音SDKとそのサーバーを実装したり WebRTCに関連するRFCやドラフトをとにかく読みまくったり いわゆるエッジな技術の検証をしたり 各種SDKを使ったWebアプリをいくつか書いたり https://github.com/skyway/skyway-con
chrome://webrtc-internals のしくみ - console.lealog();
なんとなくアテはついてたけど、中身が気になるという話を聞いたので調べてみた。 WebRTCやってるみなさんならお馴染みのあのページです。 chrome://webrtc-internals WebRTCのデバッグといえばこのページ。 特に何も仕込んでないのに、見てるページで`getUserMedia()`したり`RTCPeerConnection`が作られればその様子が見えるし、実際に流れてるメディアやデータのことまでわかる。 あれってどういうしくみ？っていうのを調べていきます。 ただのWebページ URLが`chrome://`になってるけど、れっきとしたWebページです。 なのでDevToolsでNetworkタブ見ればだいたいわかる！というわけで。 構成要素はこんな感じ。 webrtc-internals.html ただのHTML/CSS 以下の2つのJSを読み込んでる util.j
Macのsipsコマンドは画像処理に便利 - console.lealog();
こんなコマンドあるって知らんかった・・。 割と雑に画像作って良いシチュエーションに限られると思うけども、デキるコです。 sipsコマンド Scriptable Image Processing System だそうな。 参考：sips(1) Mac OS X Manual Page 手元のjpgをpngにする sips -s format png ./foo/*.jpg --out ./bar sipsコマンドで Setするよ フォーマットを pngに ./foo/*.jpgを 出力先は ./bar 手元のpngをgifにするしクオリティも下げる sips -s format gif formatOptions low bar/*.png --out ./bar どんなフォーマット、オプションがあるかは、 sips --help でみれます。 サイズを一括で変更する sips -Z 150
WebRTC Meetup Tokyo #21 に行ってきたメモ #webrtcjp - console.lealog();
WebRTC Meetup Tokyo #21 : ATND 今回は五反田にあるFreee社にて。 いつだかのNode学園祭の打ち上げで使ったところですね。 夜間入り口はコンビニ横で少しわかりにくい・・ｗ AV1 Patent issue by @dynamitter AV1 Patent Issue - Speaker Deck TL;DR AV1はこれからのコーデック 実用もできるが重い パテント問題について話すよ 歴史 Googleが発起人となってパテントフリーの動画コーデックを作ろうとしたのがはじまり VP8をOSSに MPEG/LAがVP8の特許プール設立を呼びかけ 合意したのは11社ほどで、VP8、VP9を対象 AV1やその後継は対象外 Nokiaが特許侵害を申し立てた 他のコーデックにもパテントプールはある H.265に関してはなんとパテントプールが複数ある AV1 2015
Node学園 33時限目 に行ってきたメモ #tng33 - console.lealog();
久しぶりにリクルートに来た。 41Fのホールへは、23Fで乗り換えです。 22Fで降りると上行きのエレベーターが来なくて詰みます！！！ JSX hacks 汎用木構造データ生成機としてのJSX 〜JSXをHTML以外に活用する〜 by shibukawa JSX hacks - Google スライド はじめに フューチャーという会社からきました フューチャー株式会社 B2Bの会社で 著名な本をいろいろ書かれています JSXとは Reactのキモ JSX | XML-like syntax extension to ECMAScript JavaScriptの中にHTMLが書ける 今までも似たような取り組みはあったが、どれよりも満足度が高い コンポーネント作成の生産性が高い 小さくイミュータブルに作るなどトレンドも相まって JSXが出力するHTMLは木構造 これをなにかに使えないか・・？
HTTP3Study に行ってきたメモ #http3study - console.lealog();
HTTP3Study (new) - connpass まったく詳しくない分野で脳内補完が効かないのと英語なのとで、まったく自信のないメモに仕上がりました。 間違ってたらむしろ教えてほしいです！ HTTP/3 (英語セッション) from Mark Nottingham はじめに ここは最初にWGのMtgをした部屋なので不思議な感じ 仕様の解説というより、経緯とか周辺について話すよ 仕様について議論してるけど、全ての実装・ユースケースを把握してるわけではない いままで HTTP/0.9 今でも使われてるかも `GET /`だけみたいにシンプル HTTP/1.0 いくつかヘッダがついたりした まだシンプルだったあの頃 1993年とかそのへんからユースケースが混んできた なのでみんな拡張をはじめた UAとかHostとか HTTP/1.1 Transfer-Encoding: chunk gzi
WebRTC Meetup Tokyo #18 に行ってきたメモ #webrtcjp - console.lealog();
WebRTC Meetup Tokyo #18 : ATND 台風な中、今回も海外スピーカーの多い回やった。 YouTubeでの配信もあったしアーカイブも公開されてるので、今からでも見れます！ WebRTC Meetup Tokyo #18 #webrtcjp - YouTube Gone in 1100 seconds — The weirdest bug I have ever met" by @daginge WebRTC Conferenceにきてたらしい！ Confrere WebRTCを使ったビデオチャットのサービス Confrere - Video conversations with you clients, without the hassle リンクを共有するだけではじめられるよ Dashboardが便利だよ 誰が見てるかわかる マイクやカメラの様子とかも 18min
動画切り出しアプリをElectronで作った - console.lealog();
in 弊社の開発合宿。 発表資料こちら。 動画切り出しアプリをElectronで作った ここに載せてない細かいことを、忘れないようにメモっておきます。 作ったもの GitHub - leader22/movie-slicer: Slice your favorite scenes from movie file. 動画ファイルから、任意の秒数を切り出して、新たに動画ファイルを作成するアプリです。 別途インストールされてる前提の`ffmpeg`をElectronから呼び出してるので、いわば豪華な`ffmpeg`ラッパーです。 完全に自分用で作ったので、用途としてはいわゆる`mp4`を`mp4`に切り出すだけに限定してます。 他のフォーマットも`ffmpeg`が対応してれば対応できると思うけど、手元に素材もなかったのでやってません。 Electronを使っててパッケージングもちゃんとやったので
ChromeのMediaStreamTrackとvideo要素の組合せには罠がある話 - console.lealog();
WebRTC界隈で、 Chromeの`video.srcObject = stream`はバグってるから使っちゃダメ 代わりに`video.src = URL.createObjectURL(stream)`を使え という噂があって。 とはいっても、 Safariでは`URL.createObjectURL(stream)`がエラーになる URL.createObjectURL(stream) が廃止予定となりました | Firefox サイト互換性情報 などなど事情もあるのでそろそろ`srcObject`だけ使いたい！ そのためにもどういうケースでバグってるとか、この噂の真意を確かめたいなーと思って調べてたのが事の発端。 よくわからなかった 実際に`srcObject`を使ってるコードでストリームが止まる謎の挙動を示すケースが実際にあった。 ただ代わりに`createObjectURL(
Node学園 28時限目 に行ってきたメモ #tng28 - console.lealog();
Node学園 28時限目 - connpass ついでにパネルで話してきました。 Node Interactiveに行ってきた話 by yosuke_furukawa Node Interactive North America 2017に行ってきた & 発表してきた - from scratch 資料は特になくて、このブログ記事をおさらいする感じでした。 Chrome Dev Summitに行ってきた話 by kojima 資料は見つけたら メルカリのフロントエンドエンジニア第一号さんらしい！ Chrome Dev Summit いい感じの会場と環境 PWAとかAMPの発表おおかった PWA trivagoでの取り組み PWAの成果に驚いた Edge / WebkitでもServiceWorker実装中 https://github.com/GoogleChrome/workbox Fo
やっぱりサーバーサイドレンダリングなんかしなくていいやという気持ち - console.lealog();
個人の意見 aka ポエムです。 界隈的には今さら感がすごいけど。 そんな今さらポエった事情としては、 とある案件でSPAをReactで作りつつサーバーサイドレンダリング（以下SSR）をすることになるかも SPAじゃないページもまとめてReactでSSRすることになるかも ただ個人的にはSPA+SSR不要論者 サーバーサイドのテンプレートとしてのReactも冗長なだけやろ派 でも仕事なのでしゃーない（お客様がそう申されるなら・・ なのでやるからには再考察してみて、前向きにやれる要素を見つけたい！ けどどんだけ考えてもやっぱり意義が見つけられなーい( ´Д｀)=3 という感じで、SSR自体の是非はまあどうでもよくて、ただ個人的に「しなくていい」と思ってる気持ちをまとめたものです。 技術に是も非もないです。大事なのはどう使うかなのです。 ちなみにやってみた結果・・とかいう話ではなく、やってない
JavaScriptでWebRTCやるための基礎知識 - console.lealog();
未来の自分のためのメモです。 仕事でやってないせいですぐ忘れるし、都度思い出すの大変なので・・。 ただまぁだいたいの人はSkyWayとかEasyRTCとか何かしらのライブラリを使うはずで、そういう人たちにはあまり関係ない内容かも。 生のjsでWebRTCを書くときに、先に知っておきたかった系のメモです。 素人ではないがベテランでもない、そんな微妙な知識レベルだと思います。 まだ枯れた仕様ではないので、記事を読む時は日付に注意してください... WebRTC is 何 WebでRealTimeCommunicationできる仕様 もといクライアントどうしでP2Pで通信できる仕様やそのAPI群 See WebRTC Home | WebRTC 仕様まわり WebRTC 1.0: Real-time Communication Between Browsers Identifiers for W
Node学園 25時限目 に行ってきたメモ #tng25 - console.lealog();
今度は銀座で会長が遅刻してくる回。 Node学園 25時限目 - connpass Node v8 by abouthiroppy abouthiroppy/node8 Node v8 新たなLTSバージョン GitHub - nodejs/LTS: Node.js Foundation Long-term Support Working Group 高速化がメインのアップデート WebAssemblyがデフォルトで有効に TURBOFUN https://github.com/v8/v8/wiki/TurboFan V8に最適化されたJITコンパイラ ES2015+なコードにも対応できるように 従来のCrankshaftではそこが難しかった IGNITION インタプリタ V8のJITの非効率だった部分を、予め変換することで解消 リリースは05/30 おすすめアップデート内容 N-API
東京Node学園祭2016 にスタッフ参加してきたメモ #nodefest - console.lealog();
初の2日開催でしたが、今年も無事に終えることができました。 去年に引き続き、今年もスタッフ業に携わったので、そのあれこれを忘れないうちにメモっときます。 技術ブログですが各発表についての内容は一切ありませんｗ 当日まで 公式サイトを @hiloki と一緒に作ってました。 ってもサイト内で動いてるjs部分と、メンテしやすいようにテンプレを分けるとかデプロイするスクリプトを書くみたいな細々したことしかしてなくて、ほぼ @hiloki 神の偉業です。 過去に例を見ないオシャレなサイト、TシャツもステッカーもオシャレならAfter partyのケータリングまでオシャレと、本当にオシャレ番長にはお世話になりました。 After Partyのオシャレな料理はgoodyでした！ https://t.co/B2HEEgFP4j #nodefest— Hiroki tani( ･谷･)و ̑ (@hilo
Node学園 23時限目 に行ってきたメモ #tng23 - console.lealog();
渋谷かと思ってたら東京だった回！ 「npm v4/v5/next」 by @othiym23 node-gakuen-201610.md · GitHub これは事前に共有してもらえたスクリプトです。 ほぼこれの通りに話されてたので、ざっくりメモ。 自己紹介 npmのCLIチームのリーダーです チームにはKatとRebeccaがいるよ ありがとう @watilde さん! npmのいままで 今やmillions of users, over 350,000 packagesな大プロジェクト なので機能追加は慎重にやっていく SemVerはある種の契約 npm@2からnpm@3 まさにメジャーアップデートだった でもいまだにnpm@2を使ってる人もいる npm@2のほうがインストールが早いケースもある npm@4 メジャーアップデートではあるがそんなに変わらないかも depricatedにな
フロントの奥深さに触れる〜Frontend Meetup Tokyo vol.1 #frontendmt に行ってきたメモ - console.lealog();
いってきたよ！ small画面でも、BIG画面でも、今すぐ使えるレスポンシブ活用術 by @ourmaninjapan オニール(O'NEILL)のサイトをレスポンシブにしたらコンバージョンがUPした例 モバイル対応はモバイルのためだけではない PCでもウィンドウせばめて見たりするよね モバイル専用にするか、レスポンシブにするか もはやモバイル = iPhoneではない 画面解像度もユーザー層によって違う ギークな人たちの画面解像度はw1200↑がほぼ そうでない人たちはw1200以下が多く、w400あたりが最も多い そしてモバイル = 小さい画面でもない 表示を最適化することが真のレスポンシブ レスポンシブで気をつける点 入力デバイスを考慮 タップできる領域・余白 ロールオーバーとか おすすめレスポンシブ実装10 meta[name=viewport] scalable=noはだめ！ぜっ
東京Node学園祭2015にスタッフ参加してきたメモ #nodefest - console.lealog();
行ってきたメモシリーズの番外編。 弊社はホームページのスポンサーなのでその作業をしつつ、当日もあれこれスタッフ業務してきました。 その名の通りほんと学園祭っぽくて、ただ一点早起きが必要ということに目を瞑れば、なつかし楽しかったですｗ 肝心のセッションが片手間になってしまって惜しかったので、今から資料を復習です！ 前日まで nodefest.jp ほんともう何回見たかわからんこのサイトをつくってました。 更新頻度も割と高くて、地味に時間を食われましたがいい思い出ですね( ˘ω˘)ｽﾔｧ 某ゲームっぽい実装を作ったのは私ですが、デザイナー@t32kと、ポリマスターの@tacamyと、SVGでサイを創りだした@yomotsuありきです！ おつかれさまでした！ 当日もひっそりとガチナワバリバトルが勃発してたりして、ある種の可能性を感じました。 (ワンライナーで塗りつぶそうとするような悪いオトナもい
転職しました - console.lealog();
そんなに長々と書くつもりはなくて、区切りなので一応書いておこうくらいのノリ。 いままで いまさらですが、株式会社ディー・エヌ・エーというところにいました。 ガラケーであれこれ 初期のスマホとあれこれ バグだらけのAndroidとあれこれ iOSとあれこれ モバイルでパフォーマンスがどうとか SPAがどうとか まぁそんなことを3年くらいやってました。 モバイル三昧でしたね。 これから これからは、株式会社ピクセルグリッドというところにお世話になります。 そうです、皆さんご存知のあそこです。 いわゆるすごい人しかいないあそこです。 今まで以上にあれこれ頑張らないといけません。 自宅作業OKなので、毎日寝転がって仕事してます。 引きこもりがすごく捗ります。誰か連れ出してください。 恒例のウィッシュリストとか考えたんですけど、特に欲しいものもなかったのでやめました。 ご飯のお誘いお待ちしています！
モバイル向けにSPAをつくってた話 - console.lealog();
実は4月の頭にリリースされてて、今さら感のあるつくって"た"話です。 もちろん仕事でなのですが、ココはあくまで個人ブログなので、ある程度ぼやかしつつ書きます。 知ってる人は知ってると思いますが、コレです。 作ったもの 何もしらないとイメージしづらいと思うので、いちおう。 モバイルメインのWebサービス ゲームではないが、ゲーム性の強いWebサービス シナリオゲーみたいなやつ 複数のSPAと多数のページから成るそれなりの規模 ネイティブでもShell-Appでもなく純ブラウザ向け iOS5.x/Android4.x以上が対応OS Safari/標準ブラウザ/Chrome/各種WebViewが対象ブラウザ この記事を書こうと思ったわけ 新しいFWやらライブラリやら、流行り廃りが激しい最近ですが、 実績といえばなんのアテにもならないTODOアプリとか、たかだか3,4ルートのSPAだったりで、 実
forループの中でsetTimeoutしたらiはどうなるか - console.lealog();
この手の話題は記事タイトルが本当につけにくいｗ 今回も備忘メモです。 for(var i = 0; i < 3; i++) { setTimeout(function(){ console.log(i); }); } このコード、実行するとどうなるでしょう？ こうなる for(var i = 0; i < 3; i++) { setTimeout(function(){ console.log(i); }); // 3 が3回 } 思ってたのとちがう！ こうすればOK for(var i = 0; i < 3; i++) { (function(local){ // とじこめる setTimeout(function(){ console.log(local); }); }(i)); // とじこめる！ } すごーくざっくりした理解ですが、 JavaScriptはシングルスレッド setT
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
