LoginSignup
15
14

More than 5 years have passed since last update.

ヒカラボ JavaScriptの情報交換LT会 行ってきたメモ。

Last updated at Posted at 2016-06-30

思っていたよりも初心者向けな内容でした。

大竹氏「Processing ではじめるインタラクティブコーディング入門」

到着遅れたのでデモしか見れなかった。

永井氏「ナウいJavaScriptアニメーション実装法」

  • Parallax
  • Stop motion
  • CSS animation

Parallax scrolling

今まではposition:fixed;をスクロール量取得してずらしていた。重い。
高解像度画像を10枚とか使うとブラウザ落ちる。

そこでWebGLつかった。
手書きはしんどい。

  • CreateJS ←コレ使った
  • pixi.js
  • three.js
  • Processing.js

ズレ量、要素の高さを配列で保持する。

spliteStage?で扱うとWebGLが使われる。

Stop motion animation

今まではスプライト作ってsetIntervalでずらしていた。扱いにくい。

指定したフレームを繰り返したり、止めたりしたい。

そこでCreateJSで実装。
SpriteSheet Classを使う。

JSONで配列でフレームを指定したものをオブジェクトとして細切れのアニメーションを定義できる。

CSS animation

今まではjquery.animate使っていた。カクつく。
実態はsetIntervalでの実装。

そこでVelocity.jsを使う。request animation frameを使っている。
使い方はjquery.animateと互換性があるっぽい。

まとめ

使い古された表現でも新しい実装使えば処理性能が上がるかも。

柏氏 「Webだけの知識でできたCordovaを使ったアプリ開発」

Push7というサービスを展開中。
W3C Push APIを利用。

iOSはWEBから直接Push出来ない

iOSで使うときはCordova pluginから使う。
phonegap-push使っている。

WEBページ開いたのに連動してアプリ起動。Universal Links

Cordova使った時に感じたデメリット

DeviceTokenが送られない。
デバッグ大変。
プラグインはxcode、UIはSafari開発ツール

iOSだとUniversalLinksだけど、AndroidはDeepLinksと仕様がちがう。

のびすけ氏「Let's enjoy JavaScript Robotics」

Web Bluetooth

WebUSB

navigater.*
platform
oscpu
battery
hardwareConcurerncy
connection
getGamepads
getVRdevice
getBattery
vibrate
mediaDevices

のびすけさんの発表はちょいちょい聞いてるのでメモが少なくなってしまった……。

福岡氏「React + Redux + Node.js + Raspberry Piでビデオプレイヤーを作りたかった話」

オススメBoilerplate react-webpack-node
react+redux+express

PostCSS良かったよ

classnameでオブジェクトっぽく、CSSクラス定義を使える

AMP
GoogleのWebサイトキャッシュサービス
JSが動かない

Facebook Instant Article
これもJSが動かない

AppleNewsも

15
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
14