【プレミアム】いまさら聞けないJavaScriptフレームワーク(後編) FavoriteLoadingあとで読む

: 西畑一馬
Angular、React、Vue.jsなどフロントエンドエンジニアにとっては当たり前のJavaScriptフレームワーク。
各フレームワークの特徴を知れば、あなたのプロジェクトを成功へ導くための最適なフレームワークがわかります。

JavaScriptフレームワークを導入するメリット・デメリット
(フロントエンド開発)

次はフロントエンド開発の側面からJavaScriptフレームワークを導入するメリット・デメリットを解説していきます。

開発手法がフレームワークに沿った形に限定される

ReactならReactの、AngularならAngularのルールに沿った形で開発する必要があります。
そのため自分のルールを押しつけ、独自のルールで開発するエンジニアがいなくなります。
また、知識、経験が少ないエンジニアもフレームワークに沿った形で開発しなくてはいけませんので、学習コストこそかかってしまうものの最低限の品質を担保することができます。

裏を返せば、フレームワークを利用するにはある程度の知識が必要になってきます。

開発TIPS や テクニック、ライブラリなどが豊富

現状のフロントエンド界隈では、「jQueryを使った効率の良いフロントエンド開発」といった情報はそれほど見受けられず、「Angularを利用した◯◯」、「Reactを利用した◯◯」といった情報がよく見られます。

jQueryは過去の膨大な情報やライブラリがありますが、情報の発信日からその情報の鮮度を測ることは難しくなっています。
JavaScriptフレームワークは昨今のトレンドということもあり、さまざまな情報が発信されています。そのため、発信日からその情報の鮮度が測りやすくなっています。

仮想DOMにより高いパフォーマンスが出せる

Reactを始めとした昨今のフレームワークでは、仮想DOMと呼ばれるレンダリング機構が用意されていることが多く、jQueryなどで作成したページと比較すると高いパフォーマンスを出せる場合が多いです。

これまでは、ページのHTMLを書き換えようとすると実際のHTMLを変更する必要がありました。目的の変更を行うのに10箇所のHTML変更が必要な場合は、10回HTMLを書き換える処理が必要で、これはブラウザのメモリを消費してパフォーマンスが損なわれる原因になりました。

仮想DOMでは10回の変更を一度メモリ上の構造体で行い、最終的な状態をHTMLとして出力するため、1回のHTML書き換えで10箇所の変更が可能になります。これにより高いパフォーマンスを発揮できます。

周辺のバージョンアップに左右される

デメリットとしては、周辺のさまざまなツールのバージョンアップに左右される点が挙げられるでしょう。

各フレームワークはすごいスピードで進化しており定期的にバージョンアップを行わなければレガシーな環境に陥りがちです。

ただ、バージョンアップに困難を伴うケースも多いです。バージョンが変わったことにより記述が変わった箇所などは修正しテストを行う必要があります。
そのうえ、周辺のライブラリが対応していないという理由で必ずしもスムーズにバージョンアップできるわけではありません。

とはいえ、古いバージョンを利用し続けると深刻なセキュリティアップデート等が発生した場合に、いきなり複数のバージョンアップを行わなくてはいけないことになるので、細かく定期的にバージョンアップは行なったほうがよく、この辺りの葛藤はあるでしょう。

各フレームワークの特徴

それでは現在、代表的なフレームワークであるReact(リアクト)、Angular(アンギュラー)、Vue.js(ビュージェーエス)の特徴について解説をいたします。

続きはプレミアムメンバー限定(有料)です。


プレミアムメンバーとは

この記事を書いた人: 西畑一馬

株式会社トゥーアール 代表
JavaScript / Ajaxを利用したWebアプリケーション制作やCSS3 / HTML5を利用したサイト作成を業務で行い、個人でも書籍や雑誌の執筆、Webクリエイター向けの講座 / セミナーなどの活動を行っている。


※プレミアムメンバーの方はログインすると広告が消えます。

投稿アイコンを選んでください