マイクロソフト 開発系 最新技術動向 2011 ～ 最新情報と今後のトレンド ダイジェスト版 ～ 日本マイクロソフト株式会社 パートナーソリューション営業統括本部 パートナーテクノロジー本部 プリンシパル テクノロジーアドバイザー ジニアス平井（平井昌人）

Presentation on theme: "マイクロソフト 開発系 最新技術動向 2011 ～ 最新情報と今後のトレンド ダイジェスト版 ～ 日本マイクロソフト株式会社 パートナーソリューション営業統括本部 パートナーテクノロジー本部 プリンシパル テクノロジーアドバイザー ジニアス平井（平井昌人）"— Presentation transcript:

1 マイクロソフト 開発系 最新技術動向 2011 ～ 最新情報と今後のトレンド ダイジェスト版 ～ 日本マイクロソフト株式会社 パートナーソリューション営業統括本部 パートナーテクノロジー本部 プリンシパル テクノロジーアドバイザー ジニアス平井（平井昌人） masath@microsoft.com

2 Caution 本資料に掲載されている情報は、開発中の 製品および技術に関するものも含まれてお ります。これらは今後、変更される可能性 もあります。 当日のセミナーで使用する資料は、内容の 変更やスライドの追加を行っている場合が あります。最新のプレゼンテーション資料 は以下のサイトからダウンロードして下さ い。 http://www.MasatoHirai.com/

3 アジェンダ.NET Framework 4 Visual Studio 2010 Windows Presentation Foundation 4 Silverlight 4/5 Windows Phone 7 SQL Server 2008 R2 Internet Explorer 9 HTML5 & CSS3

4 .NET Framework 4 Visual Studio 2010

5 .NET Framework の変遷.NET Framework の変遷 ～ 複雑になった階層構造を見直してバージョンを統一 ～ CLR 1.0 2007.07 1.1 2008.10 2.0 2011.04 3.0 2011.04 3.5 SP1はOS準拠 4 VS2002VS2003 VS2005 VS2008 Visual Studio 2010 1.01.12.0 UP 3.0 UP Add 3.5 Add UP 4.0 UP

6 .NET Framework 4 ～ CLR 2.0 から久々のバージョンアップ ～ ランタイムはサイドバイサイド・インストール サイドエフェクトはゼロ（既存環境を破壊せず） In-Process サイドバイサイド CLR 2.0 / CLR 4.0 をホスト アセンブリ毎に利用する CLR を決定 動的プログラミング C#:dynamic d; VB:Dim d As Object 並列プログラミング P arallel クラス・ PLINQ を提供 MEF （ Managed Extension Framework ） アドイン的なコンポーネント開発を手助けするライブラリ 新言語 F# ・ IronRuby CLR 2.0 CLR 4.0 Foo.dllFoo.dll Acme.dllAcme.dll プロセス

7 Parallel Extension & PLINQ ～ マルチスレッド・マルチコア対応の並列化ライブラリ ～ Parallel Extension Task-based プログラミングモデル System.Threading.Tasks.Task System.Threading.Tasks.Future Parallel クラス Parallel.For Parallel.Invoke Parallel LINQ-to-Objects （ PLINQ ） ParallelEnumerable VS2010 開発環境 Parallel デバッガ タスク、スタック Concurrency 分析 Parallel.For(0, n, i => work(i)); Parallel.ForEach(data, e => work(e)); var qy = from p in people.AsParallel() select p; var f = Future.StartNew(() => C()); int result = f.Value; Task t = Task.StartNew(…); t.Wait(2000); t.Cancel();

8 Visual Studio 2010 製品構成 ～ Professional / Premium / Ultimate ～ IntelliTrace™テストケース管理 UML モデリング手動テスト アーキテクチャ エクスプローラテストの記録と再生 論理クラス デザイナレイヤー ダイアグラム ロード テストWeb テスト 自動 UI テストテスト影響度分析 パフォーマンス プロファイリング静的コード分析 コードカバレッジコード メトリクス データベース変更管理データベースの配置 データベース 単体テストテスト データの生成 Silverlight 開発ツール新しい WPF エディタ Windows アプリケーション開発SharePoint 開発 Web アプリケーション開発マルチコア対応開発 Office アプリケーション開発メンバーの逆生成 クラウド アプリケーション開発IDE のカスタマイズ

9 IDE（統合開発環境）の強化 ～ 遂に Visual Studio も WPF ベースになりました ～ WPF ベースの IDE へ刷新 新スタートページ HTML ベースから XMAL ベースへ ズーム機能 呼び出し階層の表示 Call Hierarchy 変数のハイライト Highlight Reference 各種デザイナの強化 マルチモニタ対応 マルチターゲット.NET Framework 2.0 / 3.0 / 3.5 / 4.0 これまでの（ 2.0 以降）のメンテナンスも VS 2010 で OK テスト駆動開発（ TDD ）サポート強化 クラスやメソッドの自動生成（ Generate from Usage ） Visual Studio 2010 評価版を提供中！ http://www.microsoft.com/japan/msdn/vstudio/campaign/trial/

10 IntelliTrace™ ～ これは凄いぞ！ Debug.Print はもういらない！～ IntelliTrace デバッグの履歴を自動記録して煩雑なデバッグ作業を効率化 [ イベント ] と [ 呼び出し ] を記録 再生・巻き戻しも可能 情報収集設定 任意のモジュール 任意のイベント プレークポイントの エクスポート＆ インポート XML ファイルの保存 いつもでロードして 再設定が可能

11 C# 4.0 ～ テーマは "Dynamic Programming" ～ Dynamically Typed Objects dynamic というキーワードが追加 var と違ってどこでも使える AsDynamic メソッドで型変換可能 実行時は DLR を利用 オプショナル＆名前付き引数 COM Interoperability No PIA / VB ライクなコーディング Co- and Contra-variance Generic 型の引数に in, out を導入 （共変性・反変性の実現） public StreamReader OpenTextFile( string path, Encoding encoding = null, bool detectEncoding = true, int bufferSize = 1024); OpenTextFile(bufferSize: 4069, path: "foo.txt"); doc.SaveAs(ref fileName, ref missing, ref missing, ref missing,... doc.SaveAs("Test.docx"); Calculator c = GetCalculator(); int sum = c.Add(10, 20); dynamic c = GetCalculator(); int sum = c.Add(10, 20);

12 Visual Basic 10.0 ～ あの忌々しい "_" は不要になった ～ オブジェクト初期化子 改行記号 (_) の排除 複数行のデリゲート式をサポート 自動プロパティ HTML リテラル XML リテラル (VB 9.0) に続き、 HTML もリテラル記述が可能に Dim x As New List(Of Integer) From {1, 2, 3} Dim d As New Dictionary(Of String, Integer) From {{"A", 1}, {"B", 2}} Public Property MyProp As Integer = 0 Dim html = <%= From x In s Select <%= x.Name %> %> Dim t As New Thread ( Sub () For Each o In Arr Console.WriteLine(o) Next End Sub ) Dim f As Function(i As Integer) If i > 10 Then Return 0 Else Return 1 End If End Function

13 Windows API Code Pack Windows API Code Pack ～ Windows 7 の新機能を利用する多機能ライブラリ ～ Windows 7 タスクバー ジャンプリスト アイコンオーバーレイ プログレスバー タブサムネイル Sensor & Location Platform Sensor API Location API グラフィックス Direct3D / Direct2D DirectWrite Windows Imaging Component その他 フェデレーションサーチ、コモンダイアログ 電源管理、リスタート＆リカバリー

14 ASP.NET 4.0 ～ より標準に向けた改良と生産性を追求 ～ Web フォームの機能強化 Non-table-based HTML レンダリング ViewStateなしの ListView HTML スニペット ASP.NET AJAX の強化 クライアントサイドテンプレート GridView jQuery サポート jQuery Plugin キャッシュ機能の強化 Disk-based Output Cloud-based object caches Distributed object caches マルチ Web.config 配置に合わせた Web.config

15 ASP.NET MVC ～ SEO 対策が容易でインターネットサイト向き ～ Web Form 生産性重視 PostBack / ViewState 豊富なコントロール RAD による高い生産性 ASP.NET MVC Internet 対策重視 SEO 対策が容易 (URL) 単体テストが容易 タグによるコーディング

16 WCF 4.0 （Windows Communication Foundation） ～ サービスの基盤テクノロジー ～ 構成 (Configuration) の簡素化 セクション不要 既定のバインディング、ビヘイビアの提供 machine.config で既定を変更可能 暗黙のエンドポイント構成 既定構成を変更する場合のみ従来通りの記述.svc ファイル不要.svc などを使わずにサービスホストが可能 動的 Service Discovery UDP のブロードキャストによるローカルサブネット上の Adhoc Discovery と プロキシを使用した Managed Discovery の提供 サービスは serviceDicovery ビヘイビア, udpDiscoveryEndpoint などク ライアントは DynamicEndpoint, DiscoveryClient などで記述 WCF REST / Json サポート WCF 4.0 標準機能として実装

17 Visual Studio 2010 SP1 の新機能 Visual Studio 2010 SP1 の新機能 ～ 今回は無難なアップデートです ～ IIS 7.5 Express の提供 軽量・高速の Web サーバー デバッグまたは実行に管理者アカウントが不要に IIS の利用可能なほとんどの開発機能がビルトイン VC++ MFC に Animation と Direct2D のライブラリを追加 XOP, FMA4, LWP プロセッサ テクノロジーをサポート IDE インテリトレースの 64 bit 対応、ワークフロー＆ Web パーツにも対応 旧.NET Framework 3.5 の単体テストをサポート Silverlight 4 開発ツールを正式サポート HTML 5 サポート SQL Server Compact 4.0 のデザインタイムサポート Web 配置ツール 2. 0 展開可能な依存関係（アセンブリ）の追加機能 SQL Server Compact ランタイム アセンブリなど

18 Tools Update Tools Update ～ MIX 11 での発表 ～ ASP.NET MVC 3 Tools Update Windows 認証を使ったテンプレート View コードの HTML5 対応 jQuery 1.3 各種 JavaScript ライブラリの NuGet パッケージとしての搭載 Razor ASP.NET 用のオプションとなる新しいビュー・エンジン コードにフォーカスしたテンプレート方式を使用 HTML 生成周りを最適化 Modernizr HTML5/CSS3 のブラウザの対応状況を簡単に確認 クロスブラウザ対応のための JavaScript ライブラリの搭載 Kinect for Windows SDK beta XBOX の Kinect センサーを Windows アプリケーションで利用する ドライバとライブラリ

19 Windows Presentation Foundation

20 WPF4 の新機能 ～ 細かい機能強化ですがどれも重要です ～ データバインディング パイプラインを変更 UI コントロールのプロパティを設定後に バインディングソースからもう一度プロパティ値を 取得するように変更 Easing 関数 アニメーションにおける値の補完をカスタマイズ 11 種類のイージング関数をビルトイン Cached Composition CacheMode プロパティを提供 コントロールなど任意のビジュアル をビデオメモリにビットマップと してキャッシュする機能 大量オブジェクト＆コントロール 配置時の描画を高速化できる

21 WPF4 レンダリングエンジン ～ くっきりはっきりした UI になります！ ～ UseLayoutRounding プロパティ 描画をピクセル単位に揃える丸め処理を使用するかどうか Silverlight 2 で導入、WPF 4 では既定値 False Text Rendering API テキスト描画スタックを改良して文字もより明瞭に TextFormattingMode 添付プロパティ Ideal：WPF 既定のメトリックス Display：GDI 互換のメトリックス True False 16ピクセルのビットマップを Canvas.Left="0.5" で表示

22 WPF Other Features ～ WPF するなら 絶対に 4.0 がお勧めです ～ Custom Dictionary スペルチェックに使用するカスタム辞書の追加が可能 英語のみ Caret ブラシ カーソルの色 幅や形状の変更は不可 Selection ブラシ テキスト選択時の背景色 透明度 グラデーション Pixel Shader 3.0 のサポート WPF 3.5 SP1 は Pixel Shader 2.0 をサポート PS 3.0 では劇的に洗練れている #LID 1033 GeniusHirai

23 Win7 タスクバーインテグレーション ～ コードでも XAML でも OK ～ ジャンプリスト アプリケーションに渡されたコマンド ライン引数で処理を判断 アイコンは Win32 リソースか ICOファイル プログレスバー 進行状況をアイコン上にバー表示 オーバーレイアイコン タスクバーのアイコンの右下1/4に 別アイコンを表示 プレビューアイコン タスクバーのプレビューウィンドウに カスタムボタンを配置可能

24 タッチ & マルチタッチ ～ WPF 4.0 でなら楽勝！ ～ Multi-Touch サポート UIElements と UIElements3D を対応 IsManipulationEnabled プロパティ マルチキャプチャのサポート マニュピュレーション＆イナーシャ 操作（パン・ズーム・ローテーション） 慣性（弾き飛ばすような動き） 境界フィードバック（端までいったらどうする） イベント ManipulationStarting ManipulationDelta - 各種変換を適用 ManipulationInertiaStarting - 慣性を設定 TouchDown, TouchMove, TouchUp などの RAW イベントもある Mouse イベント ≒ Touch イベント

25 WPF vNEXT ～ 次なる WPF ! 現在フィードバック受付中 ～ WPF Ribbon 正式にインテグレーション予定 Silverlight Host WebBrowser コントロールでなく、 専用のホストコントロールを提供 Collections on Background Thread 大量のコレクション処理をバックグランドで処理可能に UI スレッドと別タスクで操作性を向上

26 Silverlight

27 Silverlight 3 Silverlight 3 ～ パフォーマンスの大幅向上とメディア機能の拡張 ～ 擬似 3D のサポート 平面を3次元空間に投影 WriteableBitmap 任意の UIElement の スクリーンショットが可能 メディア機能の強化 H.264 / AAC のサポート HD フルスクリーン再生 IIS Smooth Streaming コンテンツ保護の強化（DRM） GPU アクセラレーション <param name="enableCacheVisualization" value="true"/>

28 Silverlight Out-of-Browser Silverlight Out-of-Browser ～ Silverlight はついにブラウザの外へ！～ ブラウザー外実行 インストール デスクトップショートカット スタートメニューへの追加 安全で堅牢なセキュリティ 変更の自動検知と自動更新 VS の構成ダイアログで設定 ネットワーク接続検知 NetworkAddressChanged イベント GetIsNetworkAvailable プロパティ

29 Silverlight 4 - 新機能 Silverlight 4 - 新機能 ～ お客様のご要望にお応えしました ～ 印刷機能搭載 PrintDocument クラス PrintableArea, PageVisual, HasMorePages ドラッグ＆ドロップ UIElement.AllowDrop プロパティ 各種 Drag イベントを提供 マウス制御 右クリック対応 ホイール対応 クリップボード Clipboard クラス Webカメラ CaptureSource クラス CaptureDeviceConfiguration

30 Silverlight 4 - その他 Silverlight 4 - その他 ～ Silverlight 4 で大規模ビジネスアプリケーション開発 ～ IME 対応 IME のオン・オフや入力モードの指定 Out of Browser を拡張 大きさ、位置、最前列表示などのウィンドウ制御 NotificationWindow によるトーストポップアップ WebBrowser による HTML の表示 ローカルファイルシステムへのアクセス クロスドメインポリシーファイルの設置が不要 COM Automation サポート (IDispatch) Windows 限定 Controls & DataBind RichTextBox コントロール 依存プロパティとのデータバインド データバインディング StringFormat, TargetNullValue, FallbackValue を新設 IDataErrorInfo, INotifyDataErrorInfo のサポート

31 Silverlight PivotViewer Silverlight PivotViewer ～ BI のフロントしてイケてる UI ～ Silverlight PivotViewer（Silverlight 5 で標準搭載） コレクションを超視覚的に表示するコンポーネント＆コントロール CXML（コレクション XML）や イメージデータの作成ツールも提供 並び替え・フィルター機能付き DeepZoom を実装 http://www.microsoft.com/silverlight/pivotviewer/

32 Silverlight 5 Silverlight 5 ～ 現在 RC版を提供中！ 2011年中に RTW 予定 ～ Media ハートウェア・デコード トリックプレイ 電源管理 リモートコントロール Out-of-Browser Multiple Window サポート P/Invoke グループポリシーサポート パフォーマンス Faster Startup Hardware Acceleration 64 ビット プラグイン Data Binding Data Binding Debugging MVVM サポート Implicit Data Templates Ancestor RelativeSource Binding Binding in Style Setters DataContextChanged Event WCF & RIA Services WS-Trust Support Low-latency Networking MVVM friendly DataSource Windows Azure Support http://www.microsoft.com/japan/silverlight/development_SL5b.aspx

33 Windows Phone 7

34 Windows Phone 7 の特徴 ～ Easy Navigation and Access ～ メトロデザイン フレームワーク 統一された UI とインタラクション カラーバリエーションとの親和性 ライブタイル 自由なレイアウト ユーザーやアプリの登録 プッシュ配信と情報表示 ハブ クラウドと連携した 6 つの標準機能 people, office, music+video, photos, games, marketplace

35 Windows Phone 7 開発 ～ Silverlight か XNA か？ ゲームもビジネスもこれ１台で！ ～ Silverlight での開発 Silverlight のプログラミングモデル RIA プラットフォーム XNA での開発 DirectX ベースのゲーム開発環境 開発ツール Visual Studio 2010 for Windows Phone Expression Blend 4 for Windows Phone XNA Game Studio 4.0 for Windows Phone Phone インテグレーション Location & Map Control Microphone & Camera Push Notifications Accelerometer Hub Integration

36 Windows Phone Marketplace ～ ネイティブアプリの配布 ～ ビジネスモデル 唯一のアプリ配布ポイント 他国のマーケットへのアクセス可 容易な検索 便利な更新と配布 豊富な販売数 70% 収入シェア トライアル API 課金 : クレジットカード & 事業者課金 有償、フリーミアム、広告サポート、無償 Marketplace の現状 8523 本（ 2011/2/22 現在） 1 日平均 124 アプリが登録 30% がフリーウェア 平均価格は $2.32 Game, Tool 系が多い

37 SQL Server 2008 R2

38 SQL Server の歴史 ～ 技術革新の歴史 ～ SQL Server 6.0/6.5  Sybase SQL Server との 差別化  Windows との 統合  インターネット サポート  レプリケーション 搭載 第１世代 SQL Server 7.0  リレーショナル データベース アーキテクチャ の再設計  自動チューニング 機構の実装  操作性の向上  より深い Windowsとの統合  OLAP と ETL の 標準搭載 SQL Server 2000  パフォーマンスと スケーラビリティ の向上  XMLサポート  SQL Server CE  64 bit サポート  Notification Services  データマイニング  レポーティングの 搭載 SQL Server 2005  エンタープライズ クラスの スケーラビリティ  更なる信頼性 の向上  セキュリティ .NET 統合 （SQL CLR）  ネイティブ XML 対応  ETLとデータ マイニングの拡張 SQL Server 2008  監査機能の充実  透過的暗号化  ポリシーベース の運用管理  圧縮機能の充実  大規模 DWH  リソース調整  スケーラブルなBI プラットフォーム  リッチな レポーティング  非構造化データ / 位置データの新設 第3世代 第2世代 TCOの削減TCOの削減 自動チューニング自動チューニング 信頼性 と セキュリティ 信頼性 と セキュリティ BI の統合 BI の統合 各リリースの 徹底事項 コンプライアンス コンプライアンス サーバー統合 サーバー統合

39 透過的データ暗号化 ～ コンプライアンス（法令順守）は最重要項目 ～ 既存のアプリケーションを変更せずにデータ暗号化 を実現 SQL Server 2005 では 暗号化・復号化を行う際に SQL 文で EncryptByKey や DecryptByKey などを使用する必要がある メリット データベース内のすべてを暗号化 設定がとても簡単 アプリケーションの改修は不要（透過的） データの検索に何の影響もない シナリオ データ暗号化によってデータの覗き見を防止 重要なデータがハードディスクごと紛失 データベースのバックアップテープの持出し データベースファイルがコピーされて流出

40 透過的データ暗号化の仕組み ～ アプリケーションはそのままで OK ～ 仕組み データとログは I/O 時に暗号化・復号化 データ暗号化はデータベース暗号化キー(DEK)によって データベースレベルで行われる データベース暗号化キーはデータベースブートレコードに格納 データベース暗号化キーは証明書／非対称キーによって暗号化 証明書はマスターキーによって暗号化 証明書は master データベースに保管 データファイル データページはヘッダー部分を除いて全て暗号化 ファイルグループのヘッダー部分に DEK が格納 ログファイル ログ ファイルのヘッダー部分に DEK が格納 サービス マスターキー 証明書 / 非対称キー データベース 暗号化キー 暗号化 復号化 データベース ページ DEK 暗号化 データ ページ

41 透過的データ暗号化の設定例 ～ 一瞬にしてセキュアになります ～ -- マスターキーの作成 USE master CREATE MASTER KEY ENCRYPTION BY PASSWORD = N'Sedemopass1!' GO -- 証明書の作成 USE master CREATE CERTIFICATE GeniusCert WITH SUBJECT = 'GeniusCert' GO -- データベース暗号化キーの作成 USE GeniusDB CREATE DATABASE ENCRYPTION KEY WITH ALGORITHM = AES_128 ENCRYPTION BY SERVER CERTIFICATE GeniusCert -- AES_128 | AES_192 | AES_256 | TRIPLE_DES_3KEY GO -- データベースに対して暗号化を有効 ALTER DATABASE GeniusDB SET ENCRYPTION ON GO -- マスターキーの作成 USE master CREATE MASTER KEY ENCRYPTION BY PASSWORD = N'Sedemopass1!' GO -- 証明書の作成 USE master CREATE CERTIFICATE GeniusCert WITH SUBJECT = 'GeniusCert' GO -- データベース暗号化キーの作成 USE GeniusDB CREATE DATABASE ENCRYPTION KEY WITH ALGORITHM = AES_128 ENCRYPTION BY SERVER CERTIFICATE GeniusCert -- AES_128 | AES_192 | AES_256 | TRIPLE_DES_3KEY GO -- データベースに対して暗号化を有効 ALTER DATABASE GeniusDB SET ENCRYPTION ON GO

42 変更追跡 ～ CDC：Change Data Capture ～ 変更データをキャプチャできる機能 UPDATE や INSERT、DELETE による更新履歴を保管 SQL Server Agent サービス機能を利用 有効化 "dbo_商品_CT" のように 「スキーマ名_テーブル名_CT」 という名前のテーブルが自動的に作成 このテーブルへ更新履歴が記録される シナリオ 指定した時間の 過去のデータを 参照 オペレーション ミス時のデータ回復 EXEC sys.sp_cdc_enable_table @source_schema = N'dbo',@source_name = N' 商品 ',@role_name = N'cdc_Admin' EXEC sys.sp_cdc_enable_table @source_schema = N'dbo',@source_name = N' 商品 ',@role_name = N'cdc_Admin'

43 リソース ガバナ ～ アプリやユーザー単位でリソース配分を行う ～ リソースプール 最大メモリ使用率 最大 CPU 時間 許容するタイムアウト値 要求の最大数 ワークロード グループ リクエストが分類される受け皿 ワークロードに対する重要度 Low, Medium（既定）, High 分類関数 アプリケーションやユーザーを基準に分類するためのユーザー 定義分類関数 SUSER_NAME()やAPP_NAME()などでユーザーやアプリケー ションを判定してそれぞれ適切なワークロードへ送り込む Workload A Min Memory 10% Max Memory 20% Max CPU 20% Min Memory 10% Max Memory 20% Max CPU 20% Workload B Workload C Backup タスク 管理 タスク OLTP 処理 バッチ 処理 非定型 レポート Max CPU 90%

44 リソース ガバナの設定例 ～ アプリやユーザー単位でリソース配分を行う ～ -- リソースプールの作成 CREATE RESOURCE POOL ジニアスプール WITH (MAX_CPU_PERCENT = 100) -- ワークロードの作成 CREATE WORKLOAD GROUP やる気 Nothing USING ジニアスプール -- ユーザー定義分類関数の作成 CREATE FUNCTION rg_LowTaskApp() RETURNS sysname WITH SCHEMABINDING AS BEGIN DECLARE @gp_name AS sysname IF (APP_NAME() = 'batch') SET @gp_name = ' やる気 Nothing' RETURN @gp_name END GO -- 最大 CPU% を 25 に変更 ALTER RESOURCE POOL ジニアスプール WITH ( max_cpu_percent = 25 ) ALTER RESOURCE GOVERNOR RECONFIGURE GO -- リソースプールの作成 CREATE RESOURCE POOL ジニアスプール WITH (MAX_CPU_PERCENT = 100) -- ワークロードの作成 CREATE WORKLOAD GROUP やる気 Nothing USING ジニアスプール -- ユーザー定義分類関数の作成 CREATE FUNCTION rg_LowTaskApp() RETURNS sysname WITH SCHEMABINDING AS BEGIN DECLARE @gp_name AS sysname IF (APP_NAME() = 'batch') SET @gp_name = ' やる気 Nothing' RETURN @gp_name END GO -- 最大 CPU% を 25 に変更 ALTER RESOURCE POOL ジニアスプール WITH ( max_cpu_percent = 25 ) ALTER RESOURCE GOVERNOR RECONFIGURE GO

45 データ圧縮 ～ 今は Disk I/O を減らすことがパフォーマンス向上 ～ ストレージ コストの大幅削減 圧縮したデータに対する変更は通常のオペレーションと同様 データウェアハウスに散在する大規模表などに効果的 クエリ パフォーマンスの向上 I/O、アクセスページ数を削減 圧縮オプション 行 (ROW) 圧縮 固定長データ列を可変長列として格納 INT, FLOAT, REAL, MONEY, DATETIME, CHAR などに対応 ページ (Page) 圧縮 プレフィックス (Column Prefix) 列ごとに重複しているプレフィックス部分を圧縮 ディクショナリ (Dictionary) さらに詳細レベルの重複パターンを検出し圧縮 パーティションごとに設定可能 変更が頻繁→非圧縮、ほとんど変更なし→ページ圧縮

46 バックアップ圧縮 ～ バックアップ操作の所要時間が大幅に短縮 ～ バックアップ機能拡張 BACKUP DATABASE（Transact-SQL）の拡張 WITH COMPRESSION オプション 圧縮処理により CPU 使用率の上昇と I/O の減少 デフォルトは「インスタンスレベル」で設定可能 インストール時のデフォルトは無効 すべてのバックアップの種類をサポート 圧縮比率の計算 SELECT compressed_backup_size / backup_size * 100 FROM msdb..backupset; ① データの取得 ② 圧縮開始 ③ 圧縮完了 ④ データの書き込み

47 データ圧縮・バックアップ圧縮の例 ～ 変更頻度を考慮して圧縮オプションを選択しよう ～ -- 圧縮前の I/O 数と実行時間を取得 SET STATISTICS IO ON SET STATISTICS TIME ON SELECT * FROM 売上 -- 行圧縮（ Row Compression ） ALTER TABLE 売上 REBUILD PARTITION = ALL WITH ( DATA_COMPRESSION = ROW ) SELECT * FROM 売上 -- ページ圧縮（ Page Compression ） ALTER TABLE 売上 REBUILD PARTITION = ALL WITH ( DATA_COMPRESSION = PAGE ) SELECT * FROM 売上 -- 圧縮を解除して、もと（非圧縮）へ戻す ALTER TABLE 売上 REBUILD PARTITION = ALL WITH ( DATA_COMPRESSION = NONE ) -- 通常バックアップ BACKUP DATABASE AdventureWorks TO DISK = 'C:\SQLWork\AW_Normal.bak' -- 圧縮バックアップ BACKUP DATABASE AdventureWorks TO DISK = 'C:\SQLWork\AW_Compress.bak' WITH COMPRESSION -- 圧縮前の I/O 数と実行時間を取得 SET STATISTICS IO ON SET STATISTICS TIME ON SELECT * FROM 売上 -- 行圧縮（ Row Compression ） ALTER TABLE 売上 REBUILD PARTITION = ALL WITH ( DATA_COMPRESSION = ROW ) SELECT * FROM 売上 -- ページ圧縮（ Page Compression ） ALTER TABLE 売上 REBUILD PARTITION = ALL WITH ( DATA_COMPRESSION = PAGE ) SELECT * FROM 売上 -- 圧縮を解除して、もと（非圧縮）へ戻す ALTER TABLE 売上 REBUILD PARTITION = ALL WITH ( DATA_COMPRESSION = NONE ) -- 通常バックアップ BACKUP DATABASE AdventureWorks TO DISK = 'C:\SQLWork\AW_Normal.bak' -- 圧縮バックアップ BACKUP DATABASE AdventureWorks TO DISK = 'C:\SQLWork\AW_Compress.bak' WITH COMPRESSION

48 データ パーティション ～ 業務アプリケーションには必須機能かも ～ テーブルを複数のパーティションに分割し I/O を分散 テーブルをある列値の範囲で分割 アプリケーションから透過的（改修不要） 年次・月次集計などのパフォーマンスが向上 パーティション単位での処理が可能 インデックスの作成・保守 バックアップとリストア SQL Server 2008 での強化 パーティションをまたがるクエリの パフォーマンスを大幅に向上 2008 年受注 2007年受注 2006年受注 Disk1 Disk2 Disk3 売上明細テーブル ファイルグループ 2008/05… 2006/01… 2008/04… 2007/11… パーティション2008 パーティション2007 パーティション2006 FileGroup1 FileGroup2 FileGroup3

49 補足: SQL Server 2005 トピック ～ 知られていない機能＆忘れられている機能 ～ スナップショット分離 排他ロックにブロックされない読み取りが可能 SQLCLR マネージコード(C#, VB)による開発 / 実行 ストアドプロシージャ、トリガ、ユーザー定義関数 ユーザー定義タイプ データ定義言語（DDL）トリガー サーバーレベルとデータベースレベル TOPクエリ 変数やサブクエリーの指定が可能 UPDATE,DELETE にも適用可能 ピボット演算子 サービスブローカー

50 MERGE ステートメント ～ INSERTとUPDATEを合わせたような機能（UPSERT） ～ 単一ステートメントで INSERT、UPDATE、DELETE 操作を実行 ANSI SQL 2006 準拠 ユーザー定義テーブル型と組み合わせれば明細テーブルへの 複数行の更新が容易 IF NOT EXISTS(SELECT....) はもういらないかも MERGE Table1 USING (SELECT 1 AS F1, 'AAA' AS F2) AS Foo ON (Table1.F1 = Foo.F1) WHEN MATCHED AND Table1.F2 = 'XXX' THEN DELETE WHEN MATCHED THEN UPDATE F1 = Foo.F1 F2 = 'XXX' WHEN NOT MATCHED THEN INSERT VALUES (Foo.F1, Foo.F2) MERGE Table1 USING (SELECT 1 AS F1, 'AAA' AS F2) AS Foo ON (Table1.F1 = Foo.F1) WHEN MATCHED AND Table1.F2 = 'XXX' THEN DELETE WHEN MATCHED THEN UPDATE F1 = Foo.F1 F2 = 'XXX' WHEN NOT MATCHED THEN INSERT VALUES (Foo.F1, Foo.F2) 動き ①１回目は行が追加される ②２回目で “AAA” が ”XXX” に更新される ③３回目は行が削除される

51 ユーザー定義テーブル型 ～ テーブル構造の定義を表すユーザー定義型 ～ 特長 CREATE TYPE ステートメントで定義 ストアドプロシージャや関数内でテーブル値の入力パラメータと して使用 配列(コレクション)のような データの受け渡しに最適 テーブル値は tempdb システム データベースに置かれる シナリオ 1つの注文ヘッダ情報に対する n 個の注文明細行 制約事項 ユーザー定義テーブル型の定義後 にその定義を変更できない DEFAULT 値は指定できない -- 定義 CREATE TYPE MyMember AS table( ID int IDENTITY(1, 1), Name nvarchar(20)) GO -- ストアドプロシージャ CREATE PROC proc1 @m MyMember READONLY AS SELECT * FROM @m GO -- 実行 DECLARE @tb MyMember INSERT INTO @tb VALUES (N' ジニアス '), (N' 平井昌人 ') EXECUTE proc1 @tb -- 定義 CREATE TYPE MyMember AS table( ID int IDENTITY(1, 1), Name nvarchar(20)) GO -- ストアドプロシージャ CREATE PROC proc1 @m MyMember READONLY AS SELECT * FROM @m GO -- 実行 DECLARE @tb MyMember INSERT INTO @tb VALUES (N' ジニアス '), (N' 平井昌人 ') EXECUTE proc1 @tb

52 ユーザー定義テーブル型 + MERGE ～ 複雑な CUD（追加・変更・削除）もすんなり ～ 件数が不特定の明細データなどのCUDに威力を発揮 ユーザーテーブル型をパラメータとして受け取り、MERGEステー トメントで一括更新するストアドプロシージャを定義 DataTable にレコードをセットしてパラメータに与える CREATE PROCEDURE sp_testCUD @tb workTB READONLY AS MERGE INTO 明細 AS masterTB USING (SELECT * FROM @tb) AS workTB ON masterTB.F1 = workTB.F1 -- 両方にあれば更新 WHEN MATCHED THEN UPDATE SET F2 = workTB.F2 -- マスターになければ挿入 WHEN NOT MATCHED BY TARGET THEN INSERT VALUES (workTB.F1, workTB.F2) -- ワーク TB からなくなっていれば削除 WHEN NOT MATCHED BY SOURCE THEN DELETE; CREATE PROCEDURE sp_testCUD @tb workTB READONLY AS MERGE INTO 明細 AS masterTB USING (SELECT * FROM @tb) AS workTB ON masterTB.F1 = workTB.F1 -- 両方にあれば更新 WHEN MATCHED THEN UPDATE SET F2 = workTB.F2 -- マスターになければ挿入 WHEN NOT MATCHED BY TARGET THEN INSERT VALUES (workTB.F1, workTB.F2) -- ワーク TB からなくなっていれば削除 WHEN NOT MATCHED BY SOURCE THEN DELETE; // 明細レコードの取得 var adp = new SqlDataAdapter("SELECT * FROM 明細 ", cn); var tb = new DataTable(); adp.Fill(localTable); this.dataGridView1.DataSource = localTable; // 明細レコードをまとめて更新 var cmd = new SqlCommand("sp_testCUD", cn); cmd.CommandType = CommandType.StoredProcedure; cmd.Parameters.Add("@tb", SqlDbType.Structured); cmd.Parameters[0].Value = localTable; cmd.ExecuteNonQuery(); // 明細レコードの取得 var adp = new SqlDataAdapter("SELECT * FROM 明細 ", cn); var tb = new DataTable(); adp.Fill(localTable); this.dataGridView1.DataSource = localTable; // 明細レコードをまとめて更新 var cmd = new SqlCommand("sp_testCUD", cn); cmd.CommandType = CommandType.StoredProcedure; cmd.Parameters.Add("@tb", SqlDbType.Structured); cmd.Parameters[0].Value = localTable; cmd.ExecuteNonQuery();

53 ロックエスカレーションの無効化 ～ テーブル単位に設定できるようになりました ～ LOCK_ESCALATION オプション ロックエスカレーション 行（既定）→ ページ → エクステント → テーブル メモリや範囲、同時トランザクションなどによって変化 テーブル単位で設定可能 SQL Server 2005 以前は SQL Server 全体（トレースフラグ 1211） ALTER TABLE [座席予約マスター] SET (LOCK_ESCALATION = DISABLE) ロックの粒度 ロックヒント 指定した粒度でロックさせる UPDATE 給与マスター WITH (TABLOCK) SET 給与=給与 * 0.9 行（RID）行ロック キー（KEY）インデックスの行ロック ページ（PAG）8KB のページ エクステント（EXT）連続した 8KB ブロック（64KB） テーブル（TAB）テーブル全体

54 Date 型 Time 型 - 日付と時刻関数 ～ Date 型は検索条件がシンプルになる！ ～ 新しいデータ型も日付と時刻関数を使用可能 DATENAME (datepart, date)、DATEPART (datepart,date)、 DATEDIFF (datepart, startdate, enddate)、 DATEADD (datepart, number, date) 日付と時刻 ⇔ 文字列 日付と時刻データ型は、文字列リテラルとして入出力 文字列はCAST または CONVERT 関数により変換 高精度の日付時刻データ型 SYSDATETIME SYSUTCDATETIME SYSDATETIMEOFFSET これまでの日付時刻データ型を使用 GETDATE、GETUTCDATE、CURRENT_TIMESTAMP、 ISDATE(datetime/smalldatetime)

55 hierarchyid データ型 ～ 階層データ構造をエレガントに表現する ～ hierarchyid データ型 可変長のシステム データ型 SQL CLR型（.NETの構造体） 階層内の位置を表現する さまざまな階層構造に適用 組織構造 部品展開表 総勘定元帳 コンテンツ管理 メーリングリスト・掲示板 コンパクトで効率的なストレージ利用 任意の挿入および削除をサポート ツリーごとまとめて移動も操作できる T-SQL、CLR でのプログラミング 再帰コールをせずに TreeViewにセットできる

56 FILESTREAM ストレージ ～ データの保管場所を NTFS 上に確保 ～ 非構造化データ管理の問題 ドキュメント、ビデオなどのデータは、DB外で管理される データーベース内に置くと機能やパフォーマンスに制限が生じる FILESTREAM ストレージ データベース エンジンと NTFS ファイル システムの統合 SQL Server の標準機能でバックアップと復元が可能 テーブルの varbinary(max) 列に FILESTREAM 属性を追加 テーブルには UNIQUEIDENTIFIER 列が必要 制約事項 NTFS ファイルシステムでのみサポート varbinary(max) 型のみ FILESTORAGE オプションが使える 透過的な暗号化はサポートしない ログ配布では使用できるが データベース ミラーリングでは 使用できない データベース スナップショットはサポートしない

57 FILESTREAM 使用例 ～ データはファイル上だが行内データとして操作する ～ -- 有効化 EXEC sp_configure 'filestream_access_level', '2' reconfigure -- データベースの作成 CREATE DATABASE BLOB ON PRIMARY ( NAME = BLOB, FILENAME = 'C:\SQLWork\BLOB.mdf'), FILEGROUP BLOB_STORAGE CONTAINS FILESTREAM(NAME = BLOB_STORAGE, FILENAME = 'c:\SQL2008') GO -- テーブルの作成 USE BLOG CREATE TABLE ImageBank( ID uniqueidentifier ROWGUIDCOL NOT NULL UNIQUE, Picture varbinary(MAX) FILESTREAM NULL ) -- 有効化 EXEC sp_configure 'filestream_access_level', '2' reconfigure -- データベースの作成 CREATE DATABASE BLOB ON PRIMARY ( NAME = BLOB, FILENAME = 'C:\SQLWork\BLOB.mdf'), FILEGROUP BLOB_STORAGE CONTAINS FILESTREAM(NAME = BLOB_STORAGE, FILENAME = 'c:\SQL2008') GO -- テーブルの作成 USE BLOG CREATE TABLE ImageBank( ID uniqueidentifier ROWGUIDCOL NOT NULL UNIQUE, Picture varbinary(MAX) FILESTREAM NULL ) Dim cmd As New SqlCommand("INSERT INTO ImageBank VALUES (newid(), @p)", cn) cmd.Parameters.Add("@p", SqlDbType.VarBinary) Dim buf As New SqlTypes.SqlBytes() Dim fs As New FileStream(PictureBox1.ImageLocation, FileMode.Open, FileAccess.Read) buf.Stream = fs cmd.Parameters("@p").Value = buf cmd.ExecuteNonQuery() Dim cmd As New SqlCommand("INSERT INTO ImageBank VALUES (newid(), @p)", cn) cmd.Parameters.Add("@p", SqlDbType.VarBinary) Dim buf As New SqlTypes.SqlBytes() Dim fs As New FileStream(PictureBox1.ImageLocation, FileMode.Open, FileAccess.Read) buf.Stream = fs cmd.Parameters("@p").Value = buf cmd.ExecuteNonQuery()

58 空間データ型 ～ 今後はこのようなデータ型が必要となる ～ 特長 平面モデルと測地モデルに対応 Geography Markup Language (GML)を使用した空間情報の交換 空間インデックスによるパフォーマンス最適化.NET アプリケーションやVirtual Earthと連携して視覚化 geometry 型 ユークリッド座標系内の幾何データをサポート する平面空間データ型 SQL CLR型（.NETの構造体） Open Geospatial Consortium (OGC) Simple Features for SQL Specification version 1.1.0 準拠 geography 型 GPS の緯度・経度座標などの楕円体データを格納 するデータ型 SQL CLR型（.NETの構造体）

59 空間データの処理 ～ オブジェクトは.NET の型として実装されている ～ 空間データ オブジェクト（インスタンス） Point、LineString、Polygon、MultiLineString、MultiPolygon プロパティとメソッド OGC 準拠のプロパティとメソッド インスタンスメソッドは[.]を使用 静的メソッドは[::]を使用 大文字小文字が区別される 2次元ベクタのみに対応 Virtual Earth アプリケーション http://dev.live.com/virtualearth/ 空間インデックス 空間データを含むテーブル列で定義 STGeomFromText （文字列から実体 化） STArea ( 多角形の表面積 ) STLength( 長さ ) STCentroid ( 中心位置 ) STIntersects ( 重なり部分の位置 ) STDistance ( 距離 ) STGeometryN ( コレクション ) STPointN( コレクション ) STGeomFromText （文字列から実体 化） STArea ( 多角形の表面積 ) STLength( 長さ ) STCentroid ( 中心位置 ) STIntersects ( 重なり部分の位置 ) STDistance ( 距離 ) STGeometryN ( コレクション ) STPointN( コレクション ) INSERT INTO SpatialTable VALUES (geometry::STGeomFromText('POLYGON(0 0, 2 0, 2 2, 0 2, 0 0)', 0) ) INSERT INTO SpatialTable VALUES (geometry::STGeomFromText('POLYGON(0 0, 2 0, 2 2, 0 2, 0 0)', 0) )

60 空間データの操作例 ～ 位置マップから GISソリューションまで ～ T-SQL （CLRはMicrosoft.SqlServer.Types 名前空間） --- 面積を求める DECLARE @g geometry SET @g = geometry::STGeomFromText('POLYGON((0 0, 10 0, 10 10, 0 0))', 0) SELECT @g.STArea() --- ２直線の交差する点を求める DECLARE @g1 geometry, @g2 geometry, @r geometry; SET @g1 = geometry::STGeomFromText('LINESTRING (0 0, 100 100)', 0) SET @g2 = geometry::STGeomFromText('LINESTRING (0 100, 100 0 )', 0) SELECT @r = @g1.STIntersection(@g2) SELECT @r.STAsText() --- 各事業所どうしの距離を求める SELECT A. 事業所, B. 事業所, A. 位置.STDistance(B. 位置 ) FROM CompanyList A, CompanyList B WHERE A. 事業所 > B. 事業所 ORDER BY 3 --- 面積を求める DECLARE @g geometry SET @g = geometry::STGeomFromText('POLYGON((0 0, 10 0, 10 10, 0 0))', 0) SELECT @g.STArea() --- ２直線の交差する点を求める DECLARE @g1 geometry, @g2 geometry, @r geometry; SET @g1 = geometry::STGeomFromText('LINESTRING (0 0, 100 100)', 0) SET @g2 = geometry::STGeomFromText('LINESTRING (0 100, 100 0 )', 0) SELECT @r = @g1.STIntersection(@g2) SELECT @r.STAsText() --- 各事業所どうしの距離を求める SELECT A. 事業所, B. 事業所, A. 位置.STDistance(B. 位置 ) FROM CompanyList A, CompanyList B WHERE A. 事業所 > B. 事業所 ORDER BY 3

61 Internet Explorer 9

62 Internet Explorer 9 ～ より美しい Web を解き放とう ～ 高速 - PC のハードウェアリソースを最大活用 新しい JavaScript エンジン グラフィックとテキストの表示を GPU で高速化 洗練 - 主役はブラウザーではなくWebサイト Windows 7 に最適化 新しいタブブラウジング 固定サイト 信頼 - 安全性、安定性、プライバシーの向上 SmartScreen による保護を備えたダウンロードマネージャー アドオンのパフォーマンスモニタリングツール 互換 - 同一のマークアップの実現 HTML 5 をはじめとする次世代Web 標準規格に準拠 W3C のワーキンググループに積極的に参加

63 高速化のカギ ～ 現状の Web サイトに合わせたチューニング ～ JavaScript の高速化 バックグランド処理 マルチコア対応 ネイティブコード生成 レンダリングの高速化 ベースエンジンに Direct2D / DirectWrite を採用 Networking HTML CSS Collections JavaScript Marshaling DOM Formatting Block Building Layout Display

64 再設計された DOM ～ JavaScript エンジンをブラウザーに内蔵 ～ JavaScript エンジンをブラウザーに内蔵 COM のマージャリングのコストをゼロへ DOM を単一化 JavaScript とブラウザーで共有するモデルへ変更 JavaScript Engine Integration IE8 DOM VBScript DOM JavaScript 5.8 JavaScript 5.8 DOM COM IE9 VBScript DOM JavaScript Chakra JavaScript Chakra COM DOM ES5 DOM ES5

65 JavaScript IE DOM JavaScript エンジン "Chakra" ～ エコでかつ処理速度を大幅に向上した新エンジン ～ "Chakra"（ちゃくら） マルチコア プロセッサに最適化 バックグランドでのコンパイル UI スレッドの解放（JavaScript 処理中でも UI がフリー） インタプリタとネイティブ実行のハイブリッド型 Source Code DOM Objects and APIs Bytecode Generator Interpreter Machine Instructions Compiler JavaScript Libraries ECMAScript 5 Exec Loop Parser AST pCode Native Code Background Thread UI Thread

66 描画エンジンの高速化 ～ Direct2D / DirectWrite を採用したレンダリングエンジン ～ 描画エンジンの高速化 Windows 7 の機能である Direct2D / DirectWrite を採用 GPU でグラフィックとテキストの表示高速化と表示品質を向上 ハードウェアアクセラレーション

67 Window 7 への最適化 ～ Web をネイティブアプリのように使う ～ タスクバーインテクレーション タスクバーへのピン止め（固定サイト） アドレスバーの URL またはタブを タスクバーにドラッグ＆ドロップ 個別アプリのような振る舞い ジャンプリスト対応 オーバーレイアイコン対応 ライブプレビューウィンドウのボタン 高解像度の Favicon ボタンの色 ジャンプリスト ピン止め Favicon ボタン色

68 Internet Explorer 10 ～ もう次のバージョンのプレビューが始まっています ～ Internet Explorer 10 Platform Preview CSS 3 のほとんどの規約をサポートする方向で開発中 IE 9 のフォードバックも反映 パフォーマンスの追及 トピック CSS3 Grid Layout CSS3 Flexible Box layout CSS3 Multi-Column Layout CSS3 Transitions CSS3 3D Transforms ECMAScript 5 Strict Mode ダウンロード＆デモ Internet Explorer Test Drive で公開中 http://ie.microsoft.com/testdrive/

69 HTML5 のマークアップ骨組み ～ スッキリしたマークアップ ～ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML の骨組み <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML の骨組み HTML5 の骨組み HTML5 の骨組み これなら 手書きも可能 何も見ないで かける人はまずいない 何も見ないで かける人はまずいない

70 セクション：マークアップ例 ～ マークアップ量は増えるが文書構造が明確になる ～ 第１章 第１節 本文 第１項 € 本文 第２項 € 本文 第１章 第１節 本文 第１項 € 本文 第２項 € 本文 サイトタイトル サイトナビゲーション トップ 設定 ヘルプ ログアウト サイトタイトル サイトナビゲーション トップ 設定 ヘルプ ログアウト ブログタイトル …… サイドバー お知らせ 過去の記事 ブログタイトル …… サイドバー お知らせ 過去の記事 HTML5

71 HTML5：フォームコントロール ～ 13 種類を追加 ～ より RIA 的な要素として注目 tel search url email datetime date month week time datetime-local number range color HTML5

72 追加された input 属性 ～ スクリプトなしでここまで出来る！ ～ autofocus ページのロードに自動的にフォーカス required 入力必須であることを示す placeholder 入力ヒントをグレイで表示 pattern 正規表現を指定 list 入力候補を表示 で定義 郵便： <input type="text" required placeholder=" 入力必須です " pattern="\d{3}-\d{4}" autofocus/> 郵便： <input type="text" required placeholder=" 入力必須です " pattern="\d{3}-\d{4}" autofocus/> HTML5 憧れの人物： 憧れの人物： HTML5

73 ビデオ＆オーディオ ～ プラグイン不要！ブラウザーが処理を担当 ～, IE9 では MP4, H.264, AAC, MP3 をサポート 属性 controls: コントローラーの表示 poster : 再生可能までの静止画 preload: none, metadata, auto autoplay, loop video, audio で再生させるデータの指定（上から順） HTML5 に対応したブラウザをご利用下さい HTML5 に対応したブラウザをご利用下さい HTML5

74 キャンバス ～ お待たせしました！遂に IE でもサポートします ～ ページ上に解像度依存のピットマップを描画する ハードウェアアクセラレーション可能 Canvas 2D API を利用したリアルタイムの描画 GDI プログラミングモデルに似ている 描画した図形をアニメーションさせる仕組みはない（再描画する） 描画シナリオ 長方形 直線 塗り潰し 円弧 シャドウ ベジエ曲線 ２次曲線 画像 映像 HTML5 座標系 (0, 0)X Y(300, 150)

75 Canvas への描画 ～ GDI プログラミングを理解していれば簡単 ～ 基本手順 canvas オブジェクトの取得（getElementById メソッド） コンテキストの取得（getContext メソッド） 描画開始（beginPath メソッド） 色の指定（strokeColor, fillStyle プロパティ） 描画メソッド（moveTo, lineTo, closePath, rectFill, arc,…） Stroke, fill メソッド function draw() { var canvas = document.getElementById("canvas1"); var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.moveTo(300, 0); ctx.lineTo(0, 150); ctx.closePath(); ctx.strokeStyle = "red"; ctx.lineWidth = 3; ctx.stroke(); } function draw() { var canvas = document.getElementById("canvas1"); var ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.moveTo(300, 0); ctx.lineTo(0, 150); ctx.closePath(); ctx.strokeStyle = "red"; ctx.lineWidth = 3; ctx.stroke(); } JavaScript

76 SVG （Scalable Vector Graphics） ～ プラグインなしで高精細なベクターグラフィックス ～.svg /.svgz ファイルの表示, でファイル指定 Web サーバー側に *.svg image/svg+xml の MIME 設定が必要 画像ファイルとしても扱える インライン SVG タグ HTML5 <rect fill="orange" stroke="black" width="150" height="75" x="50" y="25" /> <rect fill="orange" stroke="black" width="150" height="75" x="50" y="25" /> HTML5 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <rect fill="orange" stroke="black" width="150" height="75" x="50" y="25" /> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <rect fill="orange" stroke="black" width="150" height="75" x="50" y="25" /> SVG

77 CSS3 サポート ～ IE 8 は CSS 2.1 に準拠！ IE 9 は CSS 3 一部サポート ～ ベンダープレフィックス CSS 3 はまだ最終的に確定していない プロパティや値の前にブラウザーベンダー固有の値を付ける 各社最新のバージョンではプレフィックスが不要になっている ブラウザープリフィックス IE-ms- Firefox-moz- Opera-o- Safari Chrome -webkit-.waku { border: 3px solid red; -o-border-radius:1em; -moz-border-radius:1em; -webkit-border-radius:1em; -ms-border-radius:1em; border-radius:1em; }.waku { border: 3px solid red; -o-border-radius:1em; -moz-border-radius:1em; -webkit-border-radius:1em; -ms-border-radius:1em; border-radius:1em; } CSS3 ジニアスな気分 ジニアスな気分

78 CSS3 よく使うもの ～ 角丸ボックスがやっと CSS だけで ～ border-radius ：丸みが付けられたコーナー box-shadow ： 影付き グラデーション border: 10px green double; border-radius:200px 50px 200px 50px; border: 10px green double; border-radius:200px 50px 200px 50px; CSS3 -webkit-box-shadow: 3px 3px 10px #000; box-shadow: 3px 3px 10px #000; -webkit-box-shadow: 3px 3px 10px #000; box-shadow: 3px 3px 10px #000; CSS3 a{ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FF0000), color-stop(1, #0000FF) ); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FF0000', endColorstr='#0000FF')"; /* IE8 IE9 */ } a{ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FF0000), color-stop(1, #0000FF) ); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FF0000', endColorstr='#0000FF')"; /* IE8 IE9 */ } CSS3

79 CSS3 Flexible Box Layout ～ デザイナーが一番欲している機能 ～ display:box ： ボックスレイアウト 自動的に横並び、最大の高さを持つ要素に揃う float, clearfix, clear はもう不要 box-ordinal-group： 配置された要素の並び順 box-flex： 配置された要素の幅 指定された数値の合計に対する割合が算出幅 #container{ display: -webkit-box; display: -moz-box; display: -ms-box; } Box1. ジニアス Box2. じにらす Box3. 平井昌人 #container{ display: -webkit-box; display: -moz-box; display: -ms-box; } Box1. ジニアス Box2. じにらす Box3. 平井昌人 CSS3

80 CSS3 メディア クエリー ～ デバイスの特性をより詳細に分別する ～ @media 特性 min-width, min-height max-width, max-height max-device-width max-device-height,… 論理演算子 andAND.OR notNOT media 属性 <link media="screen and (min-width: 800px)" href="LargeScreen.css" rel="stylesheet" type="text/css" /> <link media="screen and (min-width: 400px) and (max-width:800px)" href="MediumScreen.css" rel="stylesheet" type="text/css" /> <link media="screen and (max-width: 400px)" href="SmallScreen.css" rel="stylesheet" type="text/css" /> <link media="screen and (min-width: 800px)" href="LargeScreen.css" rel="stylesheet" type="text/css" /> <link media="screen and (min-width: 400px) and (max-width:800px)" href="MediumScreen.css" rel="stylesheet" type="text/css" /> <link media="screen and (max-width: 400px)" href="SmallScreen.css" rel="stylesheet" type="text/css" /> CSS3 @media screen and (min-width: 800px) { body { font-size:24pt; } } @media screen and (min-width: 400px) and (max-width: 800px) { body { font-size:18pt; } } @media screen and (max-width: 400px) { body { font-size:12pt; } } @media screen and (min-width: 800px) { body { font-size:24pt; } } @media screen and (min-width: 400px) and (max-width: 800px) { body { font-size:18pt; } } @media screen and (max-width: 400px) { body { font-size:12pt; } } CSS3

81 @font-face ルール ～ フォントのリンクが可能に ～ @font-face スタイルシートでブラウザーがダウンロードして使用する特定の フォントファイルの設定 Embedded OpenType (EOT) Web Open Font Format (WOFF) font-family で指定 unicode-range もサポート（Unicode 文字範囲） @font-face { font-family: MyFont1; src: url("OhisamaFont11.eot") format("embedded-opentype"); } @font-face { font-family: MyFont2; src: url("OhisamaFont11.ttf") format("truetype"); } p{ font-family: MyFont1; font-size: 48pt; } @font-face { font-family: MyFont1; src: url("OhisamaFont11.eot") format("embedded-opentype"); } @font-face { font-family: MyFont2; src: url("OhisamaFont11.ttf") format("truetype"); } p{ font-family: MyFont1; font-size: 48pt; } CSS3

82 CSS3 セレクター ～ これは帳票などの装飾にとても便利 ～ 疑似クラス（E:xxx） root, empty, nth-child(n), nth-last-child(n), nth-of-type(n), nth-last-of-type(n),last-child, first-of-type, last-of-type, only-child, only-of-type n は 「An+B」形式か odd（奇数）、even（偶数）を指定 tr:nth-child(3n+1) は「３行おきの最初の行」という意味 target, not(s) #demo *:not(p) は「#demo の中で を除く要素」という意味 状態疑似クラス：enabled, disabled, checked, indeterminate 属性セレクタ 要素[属性名^="開始文字列"] 要素[属性名$="終了文字列"] 要素[属性名*="含有文字列"] font-family で指定 unicode-range もサポート（Unicode 文字範囲） tr:nth-child(2n+1) { background-color: Aqua; } tr:nth-child(2n+0) { background-color: Lime; } tr:last-child { background-color: Orange; } tr:nth-child(2n+1) { background-color: Aqua; } tr:nth-child(2n+0) { background-color: Lime; } tr:last-child { background-color: Orange; } CSS3 img[src^="Images/"]{ border: 3px solid red; } img[title*=" ジニアス "]{ border: 3px solid blue; } img[src^="Images/"]{ border: 3px solid red; } img[title*=" ジニアス "]{ border: 3px solid blue; } CSS3

83 WPF / Silverlight / HTML5 どれ？ ～ 機能差がなくなりつつあり、選択に迷いますが… ～ 既存が Web（HTML, ASP.NET） なら HTML5 HTML5 は間違えなく Web プラットフォームの革新的な規格 利用できる箇所では積極的に採用して OK スマートフォンなど 非 Windows 環境への対応には必須 パフォーマンスの要求を満たすのは WPF リアルタイム処理にシビアなアプリケーション 3D, 2D など高度なグラフィックスを多用するアプリケーション ハードウェアなど低レベルな制御を必要とするアプリケーション 実行環境の要求を満たすのは Silverlight 広範囲のユーザーや環境を想定したシステム Silverlight のプラグインだけで OK Windows OS 以外（Mac）にも対応 Web をベースにしたアプリケーション Out-of-Browser 機能でオフラインでの稼働が可能

84 開発標準 ～ この１枚のスライドがすべてを物語る ～ SQL Server SQL Azure Windows Azure Storage Windows Server 2008 R2 IIS, Hyper-V, Remote Desktop,… Windows Server 2008 R2 IIS, Hyper-V, Remote Desktop,… Windows Phone iPhone Android Native App Silverlight/XNA, iPhone(OC), Android(Java) Web App HTML5 + JavaScript Http/Https Wi-Fi, 3G TCP, Named-Pipe, Http/Https, … LAN, WAN, Wireless Azure Hosted Service WebRole, WorkerRole, VMRole Azure Hosted Service WebRole, WorkerRole, VMRole Windows 7 Slate PC Native App WPF, Windows Forms, VC++ Web App Silverlight, HTML5 + JavaScript Web ASP.NET, ASP.NET MVC ASP.NET, ASP.NET MVC jQuery, Razor, Web API jQuery, Razor, Web API Service & Network WCF, AppFabric WCF, AppFabric SOAP, REST, JSON SOAP, REST, JSON Http/Https TCP, Named-Pipe, Http/Https, … TCP, Http/Https ADO.NET, Entity Framework Data Access ADO.NET, Entity Framework

85 フォーカステクノロジー ～ これは勉強しておいた方がよいと思います ～ HTML5 / CSS3 多種多様のデバイスに対応すべきノウハウ HTML5 のセマンティックな要素の理解 CSS3 での装飾（グラデーション、アニメーション） JavaScript + jQuery 今後は jQuery の利用が当たり前に イベントハンドリング、 Ajax 処理 WCF Silverlight, JavaScript(JQuery)とのデータ通信として重要 REST, JSON フォーマットへの対応 Natural User Interface（NUI） デスクトップとスマートフォンでの UI の違いを考慮した設計 指でのタッチ、タップに配慮した配置 マウスなし＝ダブルクリックなし

86 Wrap Up Wrap Up ～ ぜひ！皆様のビジネスにご活用ください ～ プラットフォームは Windows 7 & Windows Server 2008 R2 & Windows Azure & Internet Explorer & Windows Phone 7 & Office 365 クライアント Windows 7, サーバーは Windows Server 2008 R2 アプリは Windows Azure に展開、データは SQL Azure へ！ 開発ツールは Visual Studio 2010 上位エディションをお勧めします デザインツールは Expression Studio 4 Expression Blend は有益かつ重要な画面設計ツールです データベースは SQL Server 2008 R2 & SQL Azure 安心してご採用下さい。 テクノロジーは WPF, WCF, WF, Silverlight, AJAX, LINQ, 64 bit, Parallel, MVC, REST, HTML5, 仮想化, クラウド 既に実績も増えだしてて本格的な実装フェーズになりました

87 Questions And Answers

88 Thanks for Attending ! アンケートにご協力ください。 本セッション専用のアンケート用紙がございます。 お手数をお掛けしますが、ご協力ほどお願いします。