Soumettre la recherche
Mettre en ligne
DataGridを自前実装する話
•
9 j'aime
•
8,309 vues
T
terurou
Suivre
名古屋MS系秋祭り http://atnd.org/events/43243 のLT資料です、当日会場で1時間そこそこで書き上げたものなので、非常に雑です。
Lire moins
Lire la suite
Technologie
Signaler
Partager
Signaler
Partager
1 sur 19
Télécharger maintenant
Télécharger pour lire hors ligne
Recommandé
ソーシャルゲームのためのデータベース設計
ソーシャルゲームのためのデータベース設計
Yoshinori Matsunobu
暗号技術の実装と数学
暗号技術の実装と数学
MITSUNARI Shigeo
【Unity】 Behavior TreeでAIを作る
【Unity】 Behavior TreeでAIを作る
torisoup
協調フィルタリング入門
協調フィルタリング入門
hoxo_m
シリコンバレーの「何が」凄いのか
シリコンバレーの「何が」凄いのか
Atsushi Nakada
リッチなドメインモデル 名前探し
リッチなドメインモデル 名前探し
増田 亨
Rustに触れて私のPythonはどう変わったか
Rustに触れて私のPythonはどう変わったか
ShunsukeNakamura17
ドメインオブジェクトの見つけ方・作り方・育て方
ドメインオブジェクトの見つけ方・作り方・育て方
増田 亨
Recommandé
ソーシャルゲームのためのデータベース設計
ソーシャルゲームのためのデータベース設計
Yoshinori Matsunobu
暗号技術の実装と数学
暗号技術の実装と数学
MITSUNARI Shigeo
【Unity】 Behavior TreeでAIを作る
【Unity】 Behavior TreeでAIを作る
torisoup
協調フィルタリング入門
協調フィルタリング入門
hoxo_m
シリコンバレーの「何が」凄いのか
シリコンバレーの「何が」凄いのか
Atsushi Nakada
リッチなドメインモデル 名前探し
リッチなドメインモデル 名前探し
増田 亨
Rustに触れて私のPythonはどう変わったか
Rustに触れて私のPythonはどう変わったか
ShunsukeNakamura17
ドメインオブジェクトの見つけ方・作り方・育て方
ドメインオブジェクトの見つけ方・作り方・育て方
増田 亨
新入社員のための大規模ゲーム開発入門 サーバサイド編
新入社員のための大規模ゲーム開発入門 サーバサイド編
infinite_loop
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
Takuto Wada
RSA暗号運用でやってはいけない n のこと #ssmjp
RSA暗号運用でやってはいけない n のこと #ssmjp
sonickun
C# 8.0 非同期ストリーム
C# 8.0 非同期ストリーム
信之 岩永
インフラエンジニアの綺麗で優しい手順書の書き方
インフラエンジニアの綺麗で優しい手順書の書き方
Shohei Koyama
大規模ゲーム開発における build 高速化と安定化
大規模ゲーム開発における build 高速化と安定化
DeNA
イミュータブルデータモデル(世代編)
イミュータブルデータモデル(世代編)
Yoshitaka Kawashima
DDD x CQRS 更新系と参照系で異なるORMを併用して上手くいった話
DDD x CQRS 更新系と参照系で異なるORMを併用して上手くいった話
Koichiro Matsuoka
例外設計における大罪
例外設計における大罪
Takuto Wada
最近のKaggleに学ぶテーブルデータの特徴量エンジニアリング
最近のKaggleに学ぶテーブルデータの特徴量エンジニアリング
mlm_kansai
オントロジーとは?
オントロジーとは?
Kouji Kozaki
Assembly Definition あれやこれ
Assembly Definition あれやこれ
NakanoYosuke1
Pythonによる黒魔術入門
Pythonによる黒魔術入門
大樹 小倉
Observableで非同期処理
Observableで非同期処理
torisoup
ドメイン駆動設計 基本を理解する
ドメイン駆動設計 基本を理解する
増田 亨
Statistical Semantic入門 ~分布仮説からword2vecまで~
Statistical Semantic入門 ~分布仮説からword2vecまで~
Yuya Unno
【Unite Tokyo 2019】Understanding C# Struct All Things
【Unite Tokyo 2019】Understanding C# Struct All Things
UnityTechnologiesJapan002
【Unite Tokyo 2019】Unityだったら簡単!マルチプレイ用ゲームサーバ開発 ~実践編~
【Unite Tokyo 2019】Unityだったら簡単!マルチプレイ用ゲームサーバ開発 ~実践編~
UnityTechnologiesJapan002
インタフェース完全に理解した
インタフェース完全に理解した
torisoup
PHP+MySQLを使ったスケーラブルなソーシャルゲーム開発
PHP+MySQLを使ったスケーラブルなソーシャルゲーム開発
infinite_loop
altJSの選び方
altJSの選び方
terurou
2014/10/04 四国クラウドお遍路 クラウドでビックデータのスモールスタート
2014/10/04 四国クラウドお遍路 クラウドでビックデータのスモールスタート
Yukihito Kataoka
Contenu connexe
Tendances
新入社員のための大規模ゲーム開発入門 サーバサイド編
新入社員のための大規模ゲーム開発入門 サーバサイド編
infinite_loop
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
Takuto Wada
RSA暗号運用でやってはいけない n のこと #ssmjp
RSA暗号運用でやってはいけない n のこと #ssmjp
sonickun
C# 8.0 非同期ストリーム
C# 8.0 非同期ストリーム
信之 岩永
インフラエンジニアの綺麗で優しい手順書の書き方
インフラエンジニアの綺麗で優しい手順書の書き方
Shohei Koyama
大規模ゲーム開発における build 高速化と安定化
大規模ゲーム開発における build 高速化と安定化
DeNA
イミュータブルデータモデル(世代編)
イミュータブルデータモデル(世代編)
Yoshitaka Kawashima
DDD x CQRS 更新系と参照系で異なるORMを併用して上手くいった話
DDD x CQRS 更新系と参照系で異なるORMを併用して上手くいった話
Koichiro Matsuoka
例外設計における大罪
例外設計における大罪
Takuto Wada
最近のKaggleに学ぶテーブルデータの特徴量エンジニアリング
最近のKaggleに学ぶテーブルデータの特徴量エンジニアリング
mlm_kansai
オントロジーとは?
オントロジーとは?
Kouji Kozaki
Assembly Definition あれやこれ
Assembly Definition あれやこれ
NakanoYosuke1
Pythonによる黒魔術入門
Pythonによる黒魔術入門
大樹 小倉
Observableで非同期処理
Observableで非同期処理
torisoup
ドメイン駆動設計 基本を理解する
ドメイン駆動設計 基本を理解する
増田 亨
Statistical Semantic入門 ~分布仮説からword2vecまで~
Statistical Semantic入門 ~分布仮説からword2vecまで~
Yuya Unno
【Unite Tokyo 2019】Understanding C# Struct All Things
【Unite Tokyo 2019】Understanding C# Struct All Things
UnityTechnologiesJapan002
【Unite Tokyo 2019】Unityだったら簡単!マルチプレイ用ゲームサーバ開発 ~実践編~
【Unite Tokyo 2019】Unityだったら簡単!マルチプレイ用ゲームサーバ開発 ~実践編~
UnityTechnologiesJapan002
インタフェース完全に理解した
インタフェース完全に理解した
torisoup
PHP+MySQLを使ったスケーラブルなソーシャルゲーム開発
PHP+MySQLを使ったスケーラブルなソーシャルゲーム開発
infinite_loop
Tendances
(20)
新入社員のための大規模ゲーム開発入門 サーバサイド編
新入社員のための大規模ゲーム開発入門 サーバサイド編
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
RSA暗号運用でやってはいけない n のこと #ssmjp
RSA暗号運用でやってはいけない n のこと #ssmjp
C# 8.0 非同期ストリーム
C# 8.0 非同期ストリーム
インフラエンジニアの綺麗で優しい手順書の書き方
インフラエンジニアの綺麗で優しい手順書の書き方
大規模ゲーム開発における build 高速化と安定化
大規模ゲーム開発における build 高速化と安定化
イミュータブルデータモデル(世代編)
イミュータブルデータモデル(世代編)
DDD x CQRS 更新系と参照系で異なるORMを併用して上手くいった話
DDD x CQRS 更新系と参照系で異なるORMを併用して上手くいった話
例外設計における大罪
例外設計における大罪
最近のKaggleに学ぶテーブルデータの特徴量エンジニアリング
最近のKaggleに学ぶテーブルデータの特徴量エンジニアリング
オントロジーとは?
オントロジーとは?
Assembly Definition あれやこれ
Assembly Definition あれやこれ
Pythonによる黒魔術入門
Pythonによる黒魔術入門
Observableで非同期処理
Observableで非同期処理
ドメイン駆動設計 基本を理解する
ドメイン駆動設計 基本を理解する
Statistical Semantic入門 ~分布仮説からword2vecまで~
Statistical Semantic入門 ~分布仮説からword2vecまで~
【Unite Tokyo 2019】Understanding C# Struct All Things
【Unite Tokyo 2019】Understanding C# Struct All Things
【Unite Tokyo 2019】Unityだったら簡単!マルチプレイ用ゲームサーバ開発 ~実践編~
【Unite Tokyo 2019】Unityだったら簡単!マルチプレイ用ゲームサーバ開発 ~実践編~
インタフェース完全に理解した
インタフェース完全に理解した
PHP+MySQLを使ったスケーラブルなソーシャルゲーム開発
PHP+MySQLを使ったスケーラブルなソーシャルゲーム開発
Similaire à DataGridを自前実装する話
altJSの選び方
altJSの選び方
terurou
2014/10/04 四国クラウドお遍路 クラウドでビックデータのスモールスタート
2014/10/04 四国クラウドお遍路 クラウドでビックデータのスモールスタート
Yukihito Kataoka
高校生がイベントを作るということ
高校生がイベントを作るということ
Shoot Morii
デブサミ2013の明後日な楽しみ方
デブサミ2013の明後日な楽しみ方
陽一 滝川
20111205 駒澤大学講演プレゼン2
20111205 駒澤大学講演プレゼン2
眞之介 shinnosuke 広瀬 hirose
第19回せきゅぽろLT
第19回せきゅぽろLT
irasally omuko
html5j最新情報
html5j最新情報
Saki Homma
20141120 クラウドが破壊するもの、生み出すもの
20141120 クラウドが破壊するもの、生み出すもの
Seiji Akatsuka
マルチクラウドDWH(Snowflake)のすすめ
マルチクラウドDWH(Snowflake)のすすめ
Yuuta Hishinuma
Groonga導入事例−地域コミュニティサイトLOHABUU
Groonga導入事例−地域コミュニティサイトLOHABUU
Satoshi Kinokuni
サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
Masayuki Ishikawa
Similaire à DataGridを自前実装する話
(11)
altJSの選び方
altJSの選び方
2014/10/04 四国クラウドお遍路 クラウドでビックデータのスモールスタート
2014/10/04 四国クラウドお遍路 クラウドでビックデータのスモールスタート
高校生がイベントを作るということ
高校生がイベントを作るということ
デブサミ2013の明後日な楽しみ方
デブサミ2013の明後日な楽しみ方
20111205 駒澤大学講演プレゼン2
20111205 駒澤大学講演プレゼン2
第19回せきゅぽろLT
第19回せきゅぽろLT
html5j最新情報
html5j最新情報
20141120 クラウドが破壊するもの、生み出すもの
20141120 クラウドが破壊するもの、生み出すもの
マルチクラウドDWH(Snowflake)のすすめ
マルチクラウドDWH(Snowflake)のすすめ
Groonga導入事例−地域コミュニティサイトLOHABUU
Groonga導入事例−地域コミュニティサイトLOHABUU
サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
サンタクロースを支えるIT技術 @M_Ishikawa #yapcasia
Plus de terurou
Webブラウザ上で動作する帳票エンジンを作る話
Webブラウザ上で動作する帳票エンジンを作る話
terurou
自社サービスでDurable Functionsを採用した話
自社サービスでDurable Functionsを採用した話
terurou
Computation Expressions for Haxe
Computation Expressions for Haxe
terurou
デンキヤギの採用の考え方
デンキヤギの採用の考え方
terurou
Vue.jsをhaxeで
Vue.jsをhaxeで
terurou
MQTTとAMQPと.NET
MQTTとAMQPと.NET
terurou
オブジェクト指向の皮をかぶった関数型プログラミング言語 Haxe
オブジェクト指向の皮をかぶった関数型プログラミング言語 Haxe
terurou
動的なILの生成と編集
動的なILの生成と編集
terurou
FIRST STEP to Haxe/JavaScript
FIRST STEP to Haxe/JavaScript
terurou
大規模なギョームシステムにHaxeを採用してみた話
大規模なギョームシステムにHaxeを採用してみた話
terurou
大規模なJavaScript開発の話
大規模なJavaScript開発の話
terurou
Metro Style AppsでMSILver.2012/06/09
Metro Style AppsでMSILver.2012/06/09
terurou
Metro Style AppsでMSIL
Metro Style AppsでMSIL
terurou
Yet Another DLR for Silverlightの試作
Yet Another DLR for Silverlightの試作
terurou
スマートフォン×Cassandraによるハイパフォーマンス基盤の構築事例
スマートフォン×Cassandraによるハイパフォーマンス基盤の構築事例
terurou
CommonJSの話
CommonJSの話
terurou
Scala×silverlight
Scala×silverlight
terurou
DLR言語によるSilverlightプログラミング
DLR言語によるSilverlightプログラミング
terurou
Iron Python / Iron Ruby で .NET Programming
Iron Python / Iron Ruby で .NET Programming
terurou
クラウドGPS(仮)
クラウドGPS(仮)
terurou
Plus de terurou
(20)
Webブラウザ上で動作する帳票エンジンを作る話
Webブラウザ上で動作する帳票エンジンを作る話
自社サービスでDurable Functionsを採用した話
自社サービスでDurable Functionsを採用した話
Computation Expressions for Haxe
Computation Expressions for Haxe
デンキヤギの採用の考え方
デンキヤギの採用の考え方
Vue.jsをhaxeで
Vue.jsをhaxeで
MQTTとAMQPと.NET
MQTTとAMQPと.NET
オブジェクト指向の皮をかぶった関数型プログラミング言語 Haxe
オブジェクト指向の皮をかぶった関数型プログラミング言語 Haxe
動的なILの生成と編集
動的なILの生成と編集
FIRST STEP to Haxe/JavaScript
FIRST STEP to Haxe/JavaScript
大規模なギョームシステムにHaxeを採用してみた話
大規模なギョームシステムにHaxeを採用してみた話
大規模なJavaScript開発の話
大規模なJavaScript開発の話
Metro Style AppsでMSILver.2012/06/09
Metro Style AppsでMSILver.2012/06/09
Metro Style AppsでMSIL
Metro Style AppsでMSIL
Yet Another DLR for Silverlightの試作
Yet Another DLR for Silverlightの試作
スマートフォン×Cassandraによるハイパフォーマンス基盤の構築事例
スマートフォン×Cassandraによるハイパフォーマンス基盤の構築事例
CommonJSの話
CommonJSの話
Scala×silverlight
Scala×silverlight
DLR言語によるSilverlightプログラミング
DLR言語によるSilverlightプログラミング
Iron Python / Iron Ruby で .NET Programming
Iron Python / Iron Ruby で .NET Programming
クラウドGPS(仮)
クラウドGPS(仮)
Dernier
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
sugiuralab
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
taisei2219
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
Ryo Sasaki
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Yuma Ohgami
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
iPride Co., Ltd.
Postman LT Fukuoka_Quick Prototype_By Daniel
Postman LT Fukuoka_Quick Prototype_By Daniel
danielhu54
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
Toru Tamaki
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
Toru Tamaki
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
Toru Tamaki
Dernier
(10)
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
Postman LT Fukuoka_Quick Prototype_By Daniel
Postman LT Fukuoka_Quick Prototype_By Daniel
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
DataGridを自前実装する話
1.
DataGridを自前実装する話 八木照朗 / terurou 2013/09/21
2.
自己紹介 • 無職です。 • 再来週ぐらいには社長になるらしいです。 •
定款の業務内容に飲食業を入れておく予定…
3.
コミュニティ関係 • DSTokai • 東海地方のメタコミュニティ •
http://go.dstokai.info/ • NGK2013B(2013/12/14開催) • 毎年恒例のクロスコミュニティ忘年会イベント • 昼の部:LT大会、夜の部:忘年会 • ここ数年は参加者100人前後 • スポンサー募集してます • 去年はなぜかCeBITさんもスポンサーに…
4.
技術背景 • クライアント技術が割と得意です。 • Silverlight,
WPF, WinRT, HTML5/JavaScript, Android • 最近はHaxeの人みたいな扱いです。 • 分散システム, 分散KVSとかもできます。 • MSIL, ExpressionTreeをたしなむ程度に。 • 無職期間中にF#でHTTP/WebSocketサーバを 作って遊んでました。
5.
DataGridと私 過去に4回ぐらい実装したことあります。 • HTML4/JavaScript, IE6,
1万行表示 • HTML4/JavaScript, IE6, Drag&Drop • Silverlight4, 1000列×100万行表示 • HTML5/JavaScript+Ext JS, 1000列×100万行表示
6.
DataGridとは(おさらい 「Excelみたいな操作をしたいなー(はあと」
7.
Excelみたいな機能? • セル直接入力 • Tabや入力確定で次のセルに飛ぶ •
フィルタ, ソート • オートフィル • 条件付き書式 • 列の表示/非表示, 入れ替え • セル計算式 など
8.
「Excelみたいな操作がしたい」と言われたら 商用コンポーネントを使いましょう!!!
9.
商用コンポーネントのメリット • 「Excelみたいな」を9割ぐらいはカバー • どれだけ高くても100万円もあれば買える •
2人月より安い!!!
10.
商用コンポーネントではダメなケース • 政治的な理由 • 大本営が商用コンポーネントを使わない方針で確定 •
人月商売 • パフォーマンスの問題 • 1000行×100万行とか、対応できるものは皆無
11.
仕方ないので標準コントロールでどうにかする • WPF • 操作系のカスタムは必要だが割と悪くはない •
Silverlight • パフォーマンスが壊滅的 • HTML/JavaScript • 標準コントロールってなんですか???
12.
仕方なく自前実装する際のポイント • マネジメント面 • 超ハイレベルなUIエンジニアを確保する •
開発期間は半年以上かかることを覚悟する • 意思決定が変更可能な時点での技術検証が必須 • 実装面 • データとビューは必ず分離する • 描画時の計算量を可能な限り減らす • データの遅延ロード・破棄
13.
超ハイレベルなUIエンジニアを確保する • 「Excelはどのように実装されているか」が ある程度は想像のつく人 • Observer,
MVC(not Web)と言われてピンとくる • ダブルバッファリングと言われて… • セルの循環参照の検出と言わ… • 各プラットフォームの低レベル描画の知識必須 • HTML/JavaScript → DOMが遅い • XAML → UIの仮想化 • テキストの描画は遅い など
14.
開発期間は半年以上かかることを覚悟する 過去の経験から… • プロトタイプ+暫定APIの作成→3か月程度 • 安定化+APIの整備→3か月程度 ぐらいが最低ライン(当然、実装者に依存)
15.
意思決定が変更可能な時点での技術検証が必須 • プロジェクトが本格的に走り始めてからの 「やっぱりできません」は悲惨 • 最悪のケースでは人が死ぬ •
技術的・要員的に不可能だと分かった場合は 何らかの対応を取る
16.
データとビューは必ず分離する • MVVC, DataBinding •
ビューには低レベルな描画処理のみを記述
17.
描画時の計算量を可能な限り減らす • 1回だけ計算すればいい処理はキャッシュする • 各列の幅→全体の幅、各列のオフセット位置 •
データ行数→全体の高さ • 見えてない部分は描画しない • いわゆるUIの仮想化 • 画面定義情報と表示オフセット計算の嵐… 実際に表示される部分
18.
データの遅延ロード・破棄 • 「100万行を表示しろ」みたいな例 • 1行分のデータが1KByteと仮定
→ 1GByte!! • 転送量・メモリ的にどう考えても無理 • 表示中のデータ+N件のデータだけ保持 • 1行ずつスクロール時は小分けにロード • 一気にスクロールした時はちょっと待たせる
19.
まとめ • DataGridの自前実装はできるだけ避ける • ちょっとでも間違うと人が死ぬ •
OSSのDataGridを解析して勉強する • 自分はSilverlight Toolkitはかなり参考にした • HTML/JavaScriptで参考になるものは見たことない • パフォーマンスに難があるものばっかだし… • どうしても自前実装しないといけない場合には 覚悟を決めましょう!!! • やばいときのお仕事の相談、お受けいたします。
Télécharger maintenant