開発者ブログ
Frequently Asked Questions

Frequently Asked Questions

Last modified by ishikawa on 2018/12/26, 11:49

hifiveについてよく聞かれる質問とその回答集です。

一般

Q: なぜ「hifive」という名前なのですか?

ハイファイブとは、2人が同時に頭の高さで手を合わせる称賛・祝勝を意味するジェスチャー、いわゆる「ハイタッチ」の事です。
HTML5を適用したシステムが、開発者とユーザーがハイファイブできる、
お客さんとハイファイブでカットオーバーを迎えられるものになると良いなという思いを込めて命名しています。

Q: HTML5って何ですか?

A1: 現在、W3Cで策定が進められている、次世代のWeb標準です(現在正式に勧告されているのはHTML4.01)。
狭義には、様々な拡張(文書構造を表すタグやフォーム部品(種類)の追加、各要素の意味・意図の明確化など)が行われた
HTMLの新バージョン、ですが、広義には、これに加えて

  • より高い表現力(CSS3, SVG, Canvas...)
  • データの永続化(IndexedDB, WebStorage...)
  • サーバとの通信方法(XMLHttpRequest Lv2, WebSocket)
  • 端末機能との連携(Geolocation)
    など様々な関連仕様を含んだ言葉として使用されています。(現状では広義で使われる事が多いでしょう)

参考: 策定中のHTML5仕様(W3C)

A2: HTML5は果物です。完熟を待っていると、収穫の時期を逃します。

A3: HTML5は生ものです。食べたい時に(本日中に)お召し上がりになるのが最適です。

Q: 使用する際、許諾を得る必要はありますか?

個別に許諾を得る必要はありません。Apache License, Version 2.0に従ってお使いください。

Q: どのような機能を提供してくれますか?

フレームワークのランタイムはモジュール化されており、

  • Core MVC Structure … MVC機構の骨格
  • HTML5 APIs … HTML5 APIを使い易くするためのラッパー(及び開発支援機構)
  • UI Containers / UI Components … 半完成品のコンポーネント部品
  • SmartPhone Supplements … スマートフォン開発を行う為のチップス集(サンプル、雛形として提供)
  • Data Sync … サーバ側データ層との連携機能(ver.1.0.0では未実装)

などの機能を提供します。

なお、カスタムビルドを行うと、自分のプロジェクトで必要なモジュールだけを組み合わせた
フレームワークファイルを生成することができます。
これにより、不要なコードがなくなり、ファイルサイズを小さくすることができます。

Q: サポートするプラットフォームは何ですか?

モジュールによりサポートするブラウザやプラットフォームは異なります。

  • Core MVC Structureは、jQueryがサポートするプラットフォームに準じることを目標としています。
  • HTML5 APIsは、各ブラウザの対応状況に準じます。

なお、jQuery Mobile等のライブラリと組み合わせる場合は、それらのサポート対象の確認が必要です。

参考:jQuery Mobileのブラウザサポート状況

テクニカル

Q: JavaScriptフォールバックはどの程度対応している?

A1: 基本的なフォールバック (ブラウザごとの差異の吸収:リスナー登録の際addEventListener/attachEventを呼び分ける等)は、
主にjQueryを利用する形で行っています。

A2: ブラウザが機能を提供するもの(主にHTML5 APIs関係)については基本ブラウザの仕様に準じますが、
JavaScriptで対応できる範囲で、ブラウザによる差異を吸収しています。
例) WebStorage APIにおける、オブジェクトの永続化機能(型情報の保存、Date型などのシリアライズ方法の統一等)

A3: 一方、「そもそもJavaScriptが動作しないよう設定されている環境」の場合の
フォールバックについては、現在のところ検討していません。
参考:http://msdn.microsoft.com/ja-jp/library/hh273396(v=vs.85).aspx

Q: jQuery単体だとこう書くがhifiveだとこう書くといった例はありますか?

コントローラ内でDOM要素を選択するとき、jQueryの「$()」をそのまま使用するのではなく、
コントローラ内で使えるthis.$find()メソッドを使用してください。

参考:チュートリアル05.ビュー操作>単一要素の操作

Q: jQueryのこの書き方はhifiveでは使ってはいけないといった例はありますか?

A1: イベントハンドラの登録処理は、基本、コントローラにおけるイベントハンドラ定義以外では行わないで下さい。
コントローラを対象要素へ、バインド/アンバインドする際のメモリリークを回避する為です。
(jQuery-mobileを利用し、Ajax遷移でページを移動する際、特に注意が必要です。)

A2: hifiveでは、コードの記述レベルの統一、テスト容易性、保守性向上などの観点から、
原則として画面操作(DOM操作)は「コントローラ」でのみ行うよう定めています。
したがって、「ロジック」では画面操作を行わないようにしてください。

→ チュートリアル06.ロジック > どうしてロジックで画面操作をしてはいけないの?

A3: 複数のタグからなるビューを作成するときは、 JavaScriptコード中にタグ文字列を書くのではなく、テンプレートの使用を検討してください。

→ チュートリアル05.ビュー操作 > 複雑なビューの生成(テンプレートの使用)

Q: 親和性の良いUIライブラリは?(jQuery系ならOK?)

はい、jQueryプラグインとの連携を想定し、サンプルを作成しています。
参考:レシピ(サンプル集)

技術面では、コントローラが持つown()関数を利用することで、
既存のUIライブラリのコールバックとして、コントローラ内のメソッドを
(thisのコンテキストをコントローラ自身に保ちつつ)渡す事ができます。
参考:Controller#own(APIドキュメント)

Q: Velocity、JSPとの住み分けはどう考えれば良いですか?

動的な画面の生成処理を、

  1. サーバ側で行いたいか?
  2. クライアント側で行いたいか?

で判断することになると思われます。

サーバから取得した情報をクライアント側でデータとして扱いつつ様々なビューで表示させたい場合は、
2.の手段を選択した方が良いでしょう。
それ以外の場合であれば、(1.での開発に慣れているメンバーで開発を行う際は)1.を選択しても良いでしょう。

Q: ASP.NET MVCとの組み合わせは可能ですか?

Razor構文で記述された.NET MVCのビューエンジンは、サーバ側でHTMLを動的に生成します。
このため、上記「Q:Velocity、JSPとの住み分けは?」と同様使い分けを行う事が可能です。
また、Razor構文では、HTMLを生成する際、ID等のキーとなる属性も指定する事ができますので、
hifiveを使って、クライアント側での動的な変更機能を併用することも可能です。

Q: ASP.NET Web Formsとの組み合わせは可能ですか?

ASP.NET Web Formsの画面コンポーネントは、動的に(独自のルールで)HTMLファイルを生成します。
この際、HTMLのID属性等、キーとなる項目も動的に生成されるため、
hifiveをユーザーが記述してクライアント側で変更を加えるには不向きです。
従って、併用はあまりお勧めできません。

ただし、Web Formsの画面コンポーネントと関係ない部分での利用は可能です。

開発プロジェクトでの利用

Q: メンバーの内訳、スキルセットは?また、学習の進め方を教えて下さい

開発プロジェクトでの(hifiveに関わる)ロールは、大きく

  1. hifiveを使った開発手法やアーキテクチャを業務APチームに展開するAP共通(基盤)チームの方
  2. hifive上に、独自のUIコンポーネントを構築される方
  3. hifiveを使って担当分の業務APを作成される方

に分けられると思います。

1.の方は、以下参考図書、実装規約を元に、ある程度の規模でJavaScript開発を行う為の開発マナーを習得する必要があります。
2.の方は、1.に加え、hifiveの用意する拡張ポイントを理解する必要があります。(場合によっては、コミュニティに参加し→質問、議論して下さいませ)
3.の方は、チュートリアルを一通り学ばれる事で、以下、実装規約や、1.の方の出される案件固有の実装ルール、実装サンプルに基づいた開発を始める事ができるでしょう。

参考:チュートリアル


Copyright (C) 2012-2017 NS Solutions Corporation, All Rights Reserved.