気になったところをメモ。
急いで書いてるから誤字脱字あるかも

Vue Fes Japan 2018 に向けたお知らせ

@kazuponさん

  • Vue Fes Japanのチケットは9/10発売！
  • PassMarketで販売
  • チケット枚数は360枚を予定
  • 先着順らしい
  • Vue.js作者, Nuxt.js作者くるよ！
  • CFP含め11名のスピーカーが登壇
  • Vue Fes Japan 裏カンファレンス 11/10開催するよ！
  • チケット代は7,000円、Tシャツプレゼント
  • ストリーミングはないけど動画撮影はするよ

dev.to そして、阿部寛のホームページを超えろ！Vue Fes サイト高速化

@inouetakuyaさん

Vue fes 公式サイトの仕様

  • 静的サイト(Nuxt Generate)
  • Netlifyで配信

速度目標の建て方

  • ビジネスゴールから考える
    • ビジネスの内容からスピード改善がどこまで貢献できるかを考える
    • Vue FesサイトがVue.jsを使い高速で使える→Vue.js良いよねに繋げられる
  • First Meaningful Paint
    • 界隈でこのサイトは早いと言われているサイトを超えること
    • dev.toと阿部寛のホームページがベンチマーク
    • dev.to 1332msで主要コンポーネントが表示される
    • 阿部寛のサイトは600msｗ
    • Vue Fesサイトは1653ms 上記のサイトを超えられるか？

速度改善

  • クリティカルレンダリングパスを意識する
  • 本当に効果があったのか前後で確認を行う
    • 効果がなかったものはリジェクト
  • 特に効果が大きかったもの
    • 画像の最適化
      • 画像形式の選択
        • SVG > WebP > PNG > Jpeg
        • 不必要に大きな画像をロードしないようにする
        • srcsetの活用
      • 画像の圧縮
        • imageminというCLIツール
      • 画像に遅延読み込み
        • vue-lazyload
        • ファーストビューに入らないものを遅延読み込み
        • IntersectionObserverAPIで位置を判定
      • Webfont
        • Typekitを使用
        • CSSだとブロックされるのでJSで遅延読み込みさせた
      • HTTPS/2
        • netlify神！
    • 結果、dev.toの表示スピードを抜いた！

速度を維持する仕組み

  • 画像圧縮の自動化
    • huskyで自動化

速度改善なら超速本オススメっすよ！とのこと。

Vue未経験者がVue+Atomic Designでサイトリニューアルした話

@KoudaiIshigameさん

  • Vue.js初めて触ってみた所感
    • 宣言的リアクティブ良い！
    • 単一ファイルコンポーネント良い！
    • styleのscopedはやっぱり便利
    • 適当に書いても動くので設計は最初にしっかりやるべき。
  • Atomic Designの所感
    • Atomic Designやるなら最初からAtomsには手を出さない。
    • ファイルの見通しが立ちやすく楽
    • UIに着目するのはなく機能に着目してUIをつくる

デザインツールをつくりなおす話

@keimakai1993さん

  • studioというデザインツールを公開中
  • エディターにVue.js/公開にNuxt.jsを利用
  • Vue1から2の以降は負債が多かった。
    • ところどころjuQuery+jQueryUIが混合している…つらい
    • D&Dの部分を誰も触りたがらない
  • コンポーネントとはなにか？
    • sketchだと「Symbol」に当たる
    • 共通パーツ
    • 上書きできる
    • マスターを操作すれば全部に反映される
  • UIパーツは何かしらのデータと紐づく
    • コンポーネントはオブジェクトと紐付けられるのでは？

雑感) デザインツールってVue.jsで作れるんだという驚き。

ありがとう あの時 Vue.js は僕を助けた

@mtmtkzmさん

  • エモい話。

vue.js xss vulnerability and ssr/spa rendering architecture

@aintek4さん

Vue.js のXSSについて

  • ユーザーからの入力でhtmlタグを埋め込まれるとXSSが発生してしまう っていうのがあった
    • SSRのレンダリング方法に問題があった

時間切れorz

Replace View of Backbone.js with Vue.js

@_tanakaworldさん

  • Backborn.jsはjQuery依存がひどい
    • jQueryによるDOM更新は検知できない

雑感）Backborn+Vueを合体させたものを作っちゃったよというお話でした。ハンパねー