by shigemk2

当面は技術的なことしか書かない

JSer.infoについて #jserinfo

みたいなのが日本語で欲しかった→なければつくればいいじゃん

コツ

更新コストを小さくする

3000のRSSフィードを読む簡単なお仕事 800ほどのGitHubリポジトリをwatchする簡単なお仕事

Tombfixでメモ(はてぶ風)

ブクマしたデータはJSON

ためた記事をコピペするだけの簡単なお仕事です

課題

誤字脱字が多い

事前編集をもっと楽にしたい

JSer.info Editor

質問

どっから情報仕入れてるの http://www.echojs.com/

挫折しそうになったことは→あんまりない

世界のJavaScriptを読もう @ 2014 #jserinfo

3年前にやったやつの焼き直し

browser versoin

  • IE9
  • FF4
  • chrome8

  • IE12
  • firefox33
  • chrome38

IEのDeveloperバージョンが先行公開

ヘッドレスブラウザの登場

  • PhantomJSの登場
  • SlimerJS
  • trifileJS

PhantomJSのAPIがデファクトとなったヘッドレスブラウザ

FirefoxとChromeはRapid Releaseになっていってる

なぜリリース速度が上がったのか

Webは生き物なので、半年とか1年リリースじゃ間に合わない

Webの早さ=ブラウザの早さ

npmライブラリの数がrubygemsなどのライブラリを超えた

Modulecounts

http://www.modulecounts.com/

  • 新しいライブラリがどんどん増えてるのと、Semantic Versioning
  • 1commit = 1patch releaseの輩が増えた
  • バージョンを上げることへの抵抗感が減った

ライブラリとsemver

  • npmではバージョンはsemverとして解釈 npmのエコシステムに乗るにはsemverであるほうが自然 bowerとかnpmだとバージョンを上げるのが自然

Node.js

  • リリース停滞が問題視
  • Node Forward
  • Node.js Advisory Board

ECMA

  • ES Discuss
  • ES6はほぼ完了
  • ES7へ

https://esdiscuss.org/

ECMAScript 7

  • ES6とES7の策定は同時進行
  • ES7は機能ごとの仕様策定を中心に
  • もっとリリース速度を上げたい
  • 機能ごとに仕様を練っていく方向で

リリース傾向変化

  • GitHub
  • 言語も加速

Watch

  • リリースノートの変化
  • GitHubが増えた(changelogは自動生成)
  • でもGitHubとブログ記事だとブログ記事のほうがJSerInfoでは多い

  • 小さいやつほどGitHubだけにしかリリースノートを書かない

  • コミットからリリースノートを自動生成

  • まずリリースにきづけない問題→GitHubは追いやすくない→変更履歴は直接コミットを見ていく必要がある

azu/github-reader

IFTTT

作者謹製

  • chckchangelogfrom_release
  • show-diff-from-release
  • github-releases-to-feedly

GitHubも増えたけどリリースが見えないので、見る側の工夫が必要

Webの中心はブラウザ1!

  • ブラウザはベンダーがいるので、公式の情報がある
  • ライブラリなどに比べれば安定した情報

Browser Watcher

IE

IEBlog status.modern.IE hebikuzure

http://blogs.msdn.com/b/ie/ http://www.hebikuzure.com/

Firefox

https://wiki.mozilla.org/Main_Page

http://planet.mozilla.org/

Google Chrome

https://developer.chrome.com/home

http://chrome.blogspot.jp/

http://googlechromereleases.blogspot.jp/

Chromium

https://www.chromestatus.com/features

コミットサマリ http://commits.peter.sh/

Opera

operaはchromiumだけどchromiumブログよりわかりやすい

Webkit

https://www.webkit.org/

http://trac.webkit.org/

CSSまわりでAdobeがコミットしてる http://blogs.adobe.com/webplatform/

Other

http://caniuse.com/

http://platformstatustracker.azurewebsites.net/

ハッカーニュースよりJS寄り http://www.echojs.com/

週刊☆ニュースサイト(プログラマ寄り)

Person

@rockridge07

@myakura

ヲチャーをヲチするのが楽

どう変化するか

  • 人は変化する
  • 誰が変化を作っているのかを見つける
  • 変化を求める人のところには引力があり、自然と情報が集まる
  • ターニングポイント
  • GitHub
  • BTS(Bug Tracking System)
  • SNS

GitHub

  • GitHubがいなくなったら死ぬんじゃないの、俺達
  • 全てを追うのは無理なので諦めよう
  • 通知メールやフィルターを工夫して乗り切ろう

BTS

  • 実装やバグにはだいたいチケットがあって
  • 開発者はそこにいるので
  • 変化を作る人がいる
  • web開発者からのフィードバックを求めている

バグっぽいところを言える場所

specification

http://efcl.info/2014/09/02/webspec-here/

フィードバックする機会を失う問題

  • ウェブの進化は早い
  • 仕様策定者だけですべてを決めたくない
  • だからフィードバックを求めているけど、最新の情報に気づかないといけない

SNS

フロー型はだいたいの最新情報が流れてくるけど、流されやすい

  • ブログ
  • メーリス
  • メルマガ
  • ポッドキャスト

  • 好きな方法で追うのがいいよ

  • 負荷がかかる方法は長続きしない
  • 自分の好きな形に持ち込むのが大事
  • (メールが嫌いな場合はメーリスを受けない)

まとめ

  • 未来は突然やってこない
  • 最新の情報=変化の兆候
  • 変化を作る人を見つけてみるのが一番

LoopBackについて #jserinfo

BaaS

http://qiita.com/cognitom/items/ead2837115bc900a0acc

BaaSにはいろいろあって…

Service指向のParse.com Platform指向のStrongLoop

StrongLoop

http://loopback.io/

Node.js開発者が参加しているBaaS会社

オープンソース

LoopBackよいところ

  • Modelを定義すればAPIが出来る
  • Modelには関連(hasManyが持てる)
  • RDBが使える
  • テーブル定義のカスタマイズ
  • slcコマンド強力
  • Explorerが強力で、APIの動作確認ができる
  • ドキュメント、サンプルがしっかりしてる(オープンソースにしては)
  • ソースコードみれる

LoopBackわるいところ

  • Stackoverflowに情報少ない
  • Railsに比べると完成度低い
  • コードを読むのにcallback脳が必要

結論

  • Node.js使いの人はぜひ使ってみて
  • バックエンドが作られるプロジェクトでもプロトタイプやフロントエンド開発用に使えるのでは

広告業界のタグマネージメントツールの実装の現在 #jserinfo

(Inside TagManager)

タグの問題

サンクスページにhtmlとscriptを埋めて、コンバージョンを記録したりクッキーに記録したりしてる=タグ

質的にやばいやつが量産されてる→どこになんのタグを埋めたかわからなくなる

タグマネージャ

タグ管理の煩雑さを解消する

各ページにタグを埋めないで、一括でロードしてくれる

  • 様々なタグを実行しないといけない
  • 広告タグの実装がひどい(大文字scriptタグとか、document.writeとか)

  • 非同期にタグを実行するのがトレンド
  • document.writeばっかり

エラー率とかほしい→エラーを抑制する→Element.prototypeを書き換える

エラー検知

優先度付きキューを持っておいて、appendChildのやつの優先度を上げておく

実行ルール

  • location.href
  • IE6でもうごかしたい
  • そこらへんをどうにかするために、jQueryを使うしかなかった
  • JSでマクロを実装する

イベント遅延

event.preventDefaultでページ遷移阻止など

将来

タグマネージャの下にタグマネージャを実装しないといけない

WebCryptoについて #jserinfo

ウェブアプリケーションをもっとセキュアに

@iskmsy

WebCryptoについてはなす

WebCrypto(うぇぶくりぷと)

API JSのみで実装できるが、

  • 遅い
  • セキュリティ VM上で秘密鍵とか大丈夫なのか
  • 安全性の確保 統一的な安全性を確保

暗号ってなに

  • Encryption ひらぶんで暗号文を作ってメッセージを隠匿する
  • Signature 誰が書いたのかを特定出来る 否認防止
  • Authentication

  • cloud strage encryption ユーザのみが閲覧可能

  • document signing 自分が文章を作ったことを証明する
  • multi-factor authentication 通信相手の特定
  • DRM Flashに頼りきりなのよくない

Haskellの再帰マージソートをdebugしてみる

再帰を利用したマージソートをHaskellで実装するというドリルをやっていたのだけれど、

【解答例】Haskell 超入門 - Qiita

途中までしか出来なかった…そもそもdropとtakeしただけで再帰のさの字も出てこない自分のクソ実装力に涙した。

my-merge.2014102602.hs

というわけで、しょうがないからせめて解答にデバッグ関数を突っ込んで何をしているのかだけでも把握しておきたかったのであった。

my-merge.2014110109.hs

f:id:shigemk2:20141101180721p:plain

処理の流れをprintデバッグしてみると、再帰の往路で分割、復路でソート、という流れが分かると思う。というか、分かるようにならなければ困る。

というわけで、電車に乗りながらすごいh本の第4章を読んでいたのであった。

JSer.info 200回記念イベントに出た #jserinfo

JSer.info 200回記念イベント - connpass

勉強会の概要。

JSer.info

JSer.info の大体200回目の投稿を記念したイベントです。 JSer.infoの話やJavaScriptについての発表、パネルディスカッション等が行われる予定です。 JavaScriptやウェブに興味がある方はご参加下さい。

JavaScriptに興味があるので、参加しようと思いました。参加しようと思ったら、参加枠が埋まっていたので、発表枠で参加しました。

「参加枠が埋まっているなら発表枠で出ればいいじゃん」というマリー=アントワネットもびっくりのメソッドで勉強会に参加することが時たまあります。

なお、

While it is commonly attributed to Queen Marie Antoinette, there is no record of this phrase ever having been uttered by her.

Let them eat cake - Wikipedia, the free encyclopedia

「パンがダメならケーキを食べればいいじゃない」というマリー=アントワネットの代名詞は彼女が言ったものではないそうですよ。

LTやりました。

Brainfuckで遊ぼう その2

内容そのものはKernelVM探検隊 つくばで喋った内容と一緒で、Node.jsでBrainfuckのEXEコンパイラを作った話をしました。

カーネル/VM探検隊@つくばに行ってきてLTをやった #kernelvm - by shigemk2

一度発表したLTを別の勉強会で使いまわすのはどうなの?という疑問はありますが、主催者も3年前に発表した内容をリファインして発表しなおしているので、それはたぶん問題ないかと。

JSer.infoのサイトを見てもおわかりかと思いますが、発表内容もJavaScriptのトレンド情報をベースとした話が多いなか、EXEコンパイラという割と低レイヤーな話をぶっこんできたので、来週から使える情報ではなかったです。

でも、やっぱりhexdumpの結果をそのまんま写経した話は普通にウケがよかったです。

ただ、binutilsとgccの話とか、もうちょっと話をしとけばよかったなと思いました。

出てみた感想

VGAケーブルがない

まず、Mac率が尋常じゃなかったです。これは前のES6カジュアルトークでも感じたことですが、JS開発はフロントエンドが主戦場なので、自然とMac使いが増えていくのでしょう。

だからかどうか知りませんが、プロジェクタに繋げられる端子もDVIとHDMIとMacのThunderboltにしか対応していなくて、ThinkPad使いの僕は大変難儀しました。

なので、主催者からMacを拝借してLTをやる運びとなりました。ネットにつながりさえすればプレゼンが出来るので…

ThinkPadを持ってきてすみませんでした。

JSのトレンドに全くついていけない

前提知識として、

  • ECMAScript
  • フレームワーク
  • モジュール(require.jsなど)

などについて最新のトレンドを知っておく必要がありました。 フレームワークもモジュールも使わずにせいぜいjQueryとGruntだけでシコシコ開発をしていた人間としては、特にパネルディスカッションの内容が激流のような目まぐるしさで、話の内容に全くついていけてませんでした。すみませんでした。

というわけで、今後やるべきこと

JSer.infoにしてもそもそも先週初めて知ったような状態だったので、JavaScriptに限らず、もう少し技術的なトレンドについてアンテナを貼っておく必要があると思った次第です。

というわけで、長らく放置してあったRSS Readerを復活させて、技術的な最新情報が入ってくる体制を整えることがまず必要なんじゃないかなって思いました。

こちらからは以上です。

どうもありがとうございました。