$30 off During Our Annual Pro Sale. View Details »

新しい IE とJavaScript で動く最近の Web アプリケーション

Avatar for yomotsu yomotsu
August 01, 2013
Programming
0
220

新しい IE とJavaScript で動く最近の Web アプリケーション

Avatar for yomotsu

yomotsu

August 01, 2013
Tweet

More Decks by yomotsu

See All by yomotsu
three.jsとRapierでレースゲームが3日でできた話
Avatar for yomotsu yomotsu
0
720
PBR in three.js
Avatar for yomotsu yomotsu
1
980
dialog要素でつくるモーダルダイアログ
Avatar for yomotsu yomotsu
0
1k
IE to Edge
Avatar for yomotsu yomotsu
1
370
A Camera Control Library for three.js
Avatar for yomotsu yomotsu
1
1.4k
Let’s try AR
 on mobile Web with <model-viewer>
Avatar for yomotsu yomotsu
0
570
WebXR: Beyond
 WebGL
Avatar for yomotsu yomotsu
2
1.9k
Non-DOM components with WebGL in Vue.js
Avatar for yomotsu yomotsu
5
13k
WebGL Libs for
 WebApp Frameworks
Avatar for yomotsu yomotsu
4
7.9k

Other Decks in Programming

See All in Programming
実は歴史的なアップデートだと思う AWS Interconnect - multicloud
Avatar for maroon1st maroon1st
0
170
Cap'n Webについて
Avatar for Yusuke Wada yusukebe
0
130
tsgolintはいかにしてtypescript-goの非公開APIを呼び出しているのか
Avatar for syumai syumai
7
2.2k
Developing static sites with Ruby
Avatar for Masafumi Okura okuramasafumi
0
290
AtCoder Conference 2025「LLM時代のAHC」
Avatar for Yuki Imajuku imjk
2
490
AIエンジニアリングのご紹介 / Introduction to AI Engineering
Avatar for r-kagaya rkaga
8
2.8k
認証・認可の基本を学ぼう前編
Avatar for kaza kouyuume
0
250
FluorTracer / RayTracingCamp11
Avatar for kugi kugimasa
0
230
WebRTC と Rust と 8K 60fps
Avatar for tnoho tnoho
2
2k
re:Invent 2025 のイケてるサービスを紹介する
Avatar for maroon1st maroon1st
0
110
テストやOSS開発に役立つSetup PHP Action
Avatar for Atsushi Matsuo matsuo_atsushi
0
160
手が足りない！兼業データエンジニアに必要だったアーキテクチャと立ち回り
Avatar for zinkosuke zinkosuke
0
710

Featured

See All Featured
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
355
21k
[SF Ruby Conf 2025] Rails X
Avatar for Vladimir Dementyev palkan
0
520
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
65
8.3k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
61
9.6k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
127
17k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
515
110k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
1
100
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.2k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.7k

Transcript

  1. 新しいIEとHTML5JavaScriptで動く 最近のWebアプリケーション 小山田 晃浩 | @yomotsu | (株)ピクセルグリッド

  2. None

  3. 新しいIEで動かない？

  4. None
  5. None
  6. None
  7. None

  8. •Quirks Modeで実装している •IE独自拡張を使っている •プラグインに頼っている •よくわからないけど動作保証できない

  9. Quirks Mode

  10. div{ width: 300px; padding: 100px; border: 3px solid #000; background:

    #EEEEEE; }

  11. Standards Mode

  12. Standards Mode Quirks Mode

  13. None

  14. DOCTYPE宣言 モード なし <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html> Q Q S S S

  15. IE独自拡張

  16. •ActiveXObject •VBScript •Data Binding •VML and others...

  17. •ActiveXObject •VBScript •Data Binding •VML and others... •Data属性 •SVG •JavaScript

    ଟ͘͸)5.-Ͱ΋Ͱ͖·͢

  18. 要プラグイン技術

  19. ಈըετϦʔϛϯάͳͲ͸·ͩґଘͤ͟ΔΛಘ·ͤΜ͕ ଟ͘ͷ͜ͱ͸+BWB4DSJQUͰ΋ՄೳͰ͢

  20. None

  21. •Doctypeをしっかり宣言 •IE独自拡張に頼らない •プラグインに頼らない

  22. Quirks Modeと IE独自拡張の延命

  23. *&͸ݹ͍Τϯδϯ΋උ͍͑ͯ·͢

  24. None
  25. None
  26. None

  27. ... <head> ... <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"> <title>...<title> ... </head> ...

    ... ...
  28. None

  29. http://blogs.msdn.com/b/ie/archive/2010/03/02/how-ie8-determines-document-mode.aspx

  30. •古いIEをほぼ再現できる •Tridentのバージョンは変わる •JScriptのバージョンは変わらない

  31. Trident (MSHTML) JScript IE6 IE7 IE8 IE9 IE10 3.0? (6.0)

    5.6 3.1? (7.0) 5.7 4.0 (8.0) 5.8 5.0 (9.0) 9 6.0 (10.0) 10

  32. demo navigator.userAgent document.compatMode document.documentMode ScriptEngineMajorVersion() の比較

  33. これからの Webシステム構築

  34. None
  35. None

  36. 最近のIE

  37. 0 2500 5000 7500 10000 IE7 IE8 IE9 IE10 IE11

    SunSpider JavaScript Benchmark Results

  38. 早くなった

  39. None

  40. 新技術をサポート (主にIE9以降)

  41. None
  42. None
  43. None
  44. None

  45. ほぼ 標準技術だけで Webアプリケーションを作れる

  46. None
  47. None
  48. None
  49. None
  50. None

  51. •サーバーからはJSONを吐き出す •ブラウザーはJSONを受け取る •画面はJavaScriptで構築

  52. None
  53. None
  54. None
  55. None
  56. None
  57. None
  58. None

  59. 最近のJavaScriptに注目を

  60. まとめ

  61. 政府専用メールサービスを作ることになったとしても フロントエンドでは 標準の技術を使おう

  62. www.codegrid.net

  63. Thank you @yomotsu