2018が開催されました。実行委員会(Vue.js日本ユーザーグループを中心とし有志スタッフ)の主催によるカンファレンスです。本記事では当日の模様をレポートします。基礎から実践アプリケーション開発までを執筆するなど国内におけるVue.js普及の中心的な人物です。2018に至るまでの経緯,国内でのVue.jsの盛り上がりなどを紹介しました。Japanはユーザーコミュニティ主導のイベントとしてはかなり大規模なものと述べ,開催をサポートしてくれたコミュニティ,スポンサーへの感謝を表明しました。You氏がキーノートを始めます。You氏はVue.jsのオーサー(オリジナル開発者)で現在も開発の中心人物です。企業のバックグラウンドを持たずに,個人を中心とした開発スタイルのVue.jsでは多大な尊敬と人気を集めています。3.0へのアップデートについて語ります。3.0で何が変わるかをリストアップしました。仮想DOMを0からフルスクラッチで再実装することで,さらなる高速化を実現します。mountとpatchの処理が最大100%高速化されます。内部的には変更がありますが,APIにはほぼ変更がないのも特徴です。ライブラリ作者はちょっと手を動かす必要がありますが,基本的には変わらず使い続けられます。新しい実装では,プロキシ(記者注:JavaScriptのProxy)を用いることで,言語すみずみまで高速に処理できるような実装を採用可能です。ES5では実現できなかったことを実現させます。プロキシのパワーを活かした変更です。プロパティ(プロパティプロキシ)の高速化は特に重要で,2.0最大のパフォーマンス上の課題を解決しました。―実行中のオーバーヘッド対策としてのコンパイル時ヒントコンパイラにも改善を加えます。コンパイルタイムヒントによって(生成後の)実行時オーバーヘッドを削減します。(Vue.jsにおける)コンパイル時最適化の基本的な考え方は,可能な限りの情報をテンプレートから取得し,不要な処理を生成コードから減らすというものです。これによってJSエンジンが最適化しやすくなります。したオーバーヘッド対策でも,規模が大きくなるほど効果が出てきます。スロット再生の最適化を行うケースでは,インスタンスの依存関係を正しくトラックし,不要な親子のレンダリングを回避できます。いうところを意識してコードを手で書こうとすると大変ですが,これをテンプレート書くだけでうまく実現できるようになります。Hoistingなどについてテンプレートと生成例を示しました。これらの最適化をほどこした3.0のプロトタイプでは,コンポーネントインスタンスの初期化が最大100%も高速になります。アプリ全体の速度が2倍に,メモリ使用量が半減しうることを例と共に示します。これらの最適化によって,(⁠互換性維持を意識するため)ユーザーが書くコードは変わらないのに,3.0を使うだけで速くなります。小さくTree-shakingへの対応を盛り込みます。Tree-shakingとは実行しない(不要な)コードを自動で削除することを意味します。WebpackやRollupによって提供されます。Modulesを採用し,ビルドプロセスでインポート対象を選定して必要なものだけを小さく利用できるにします。2.5.17では30KB超なので約1/3のサイズ)になるはずです。メンテナンスしやすく(Vue.js開発者側から見てメンテナンス性を高めるため)アーキテクチャの一層の洗練,パッケージの適切な分離,テストセットアップの改善を目指します。単一のモノリシックなリポジトリ構成だったところから,パッケージ切り出しなどを工夫して分離していきます。パッケージ全体の切り分けについては,これは開発プロジェクト側から見た話です。Vue.jsを利用する側の開発者がこれらをいちいち選んで使う必要はありません。ネイティブ向けに作りやすくカスタムレンダラAPI。出力先をブラウザ(Vue.js)以外のものに広げようという試みです。ScriptやWeexなどネイティブから使えていたが,あまりよくありませんでした。3系では簡潔なAPIをつくることで,よりネイティブから使いやすくします。カスタムレンダラが簡単に使えて,コアランタイム使うだけですむというものを目指します。コードの保守性を向上コードの保守性を向上するための仕組みも提供します。リアクティビティAPI。コンポーネント内のデータなどを新しい監視システムがよしなに管理します。書きやすくなったオブザーバーAPIの進化のようなものです。コンポーネントの再描画を理解するようになります。レンダートラックスとレンダートリガーなど変更検知力の向上を実現します。TSX(JSXのTypeScript版)導入など,TypeScriptの強化を企画しています。Vue.jsは,katashin氏などのメンバーが頑張ってくれていますが,まだまだTypeScript(型)の部分で改善の余地があるという状態です。TSXでより型の力を使えるようにしたいです。3.0で採用することが決定している機能に加えて実験的なAPI(記者注:いずれもReactに影響されたものと思われる)についての解説もあります。Hooks(実験的な機能)HooksはReactで登場したAPIで,Vue.jsでも試験的に使えないか試しています。mixinsの課題,名前空間の問題などをHooks採用で解決できるのではないかと思い試しています。Abramov氏のHooksの話も興味深いです。You氏はhooksのコンセプト,処理のカプセル化ができている点は興味深いと感じていると紹介しました。Slicingは(非同期処理などを用いてVue.jsの)処理を細切れにすることで,操作のブロックを防ぎます。60fps実現の大きな助けとなるものです。3.0を中心に次世代のVue.jsを垣間見ることのできる発表でした。基礎から実践アプリケーション開発までVue.jsを初歩から実践まで徹底的に解説。2019」を開催しました。DAY1・DAY2の様子を注目セッションとともにお伝えします。LINEのエンジニア3名がイベントに先駆けて見どころを紹介します。コードの安全性・安定性を高める開発サイクル~テスト管理の効率を上げ,脆弱性診断を自動で行う~本連載では,連載「業務を改善する情報共有の仕掛け」を受けつつ,安全性・安定性を加えた開発サイクルについて考えていきます。若者世代から圧倒的な人気を誇るライブ配信&動画投稿コミュニティアプリ「MixChannel」(ミクチャ)の裏側(レコメンドシステムやサーバサイド開発など)について解説していきます。その他の連載CSS3アニメーションでつくるインターフェイス表現CSS3によるアニメーション表現を紹介していきます。その中でも,幅広い読者に応用してもらえるだろうインターフェイスを主なお題とします。MySQL道普請便り本連載では,MySQLを使ったアプリ開発・運用に関するノウハウをご紹介していきます。RecipeUbuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。JavaScriptセキュリティの基礎知識JavaScriptに関するセキュリティ上の問題はどこで発生し,どうすれば防ぐことができるのか?について解説していきます。〜システムをきちんと運用するための基礎知識システムは「作って終わり」ではなく,運用の中でさまざまな問題が発生します。問題の発生に備えて事前にどのような対応をしておくべきなのか,問題発生時に何をしなければならないのか,ポイントを解説していきます。きたみりゅうじの聞かせて珍プレーソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。Linuxのメンテナンスの傍ら,Linuxやオープンソースソフトと日々を過ごす著者が,その魅力とつきあい方を,エッセイ風味でお届けします。PRESS特別編集部員,さわやか笑顔のスーパーハカーはまちちゃんとネット大好き14歳わかばちゃんが,毎号,読者の皆さんから寄せられたおたよりを紹介します。皆さんの日頃の悩みにも答えちゃいますよ。]メールでのお知らせメールで次の案内をお送りしております。メールの配信を希望する方は,利用したい項目をチェックしてメールアドレスを入力し,[登録]ボタンをクリックしてください。UPDATES[ほぼ週間に1回]新刊メールマガジン[ほぼ週間に1回]電脳会議の各号案内[ほぼ1ヵ月半に1回]※変更する場合や停止する場合は,登録情報変更ページをご覧ください。※登録いただいたメールアドレスには,そのお知らせ以外,配信いたしません。Ltd.ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。