Embed Size (px)
Citation preview
Множество браузеров
Internet Explorer Firefox Google Chrome Safari Opera
Архитектурные различия
Фоноваястраница
Вкладка #1
Вкладка #2
Вкладка #3
Архитектурные различия
XUL Window
XUL Overlay
XUL Tab #1
XUL Browser #1
DOM
XUL Tab #2
XUL Browser #2
DOM
Архитектурные различия
XUL Window
XUL Script
XUL Tab #1
XUL Browser #1
DOM
XUL Tab #2
XUL Browser #2
DOM
bootstrap.js
Архитектурные различия
XUL Window
XUL Script
XUL Tab #1
XUL Browser #1
bootstrap.js
Frame script
DOM
Архитектурные различия
Browser Helper Object(dll)
Вкладка #1
Browser Helper Object(dll)
Вкладка #2
Поддержка технологий
● Хотите ли поддерживать IE?
Поддержка технологий
● Хотите ли поддерживать IE?● IE 8 — CSS 2 и JScript (ES 3)
Поддержка технологий
● Хотите ли поддерживать IE?● IE 8 — CSS 2 и JScript (ES 3)● IE 9 — CSS 3 и ES 5
Поддержка технологий
● Хотите ли поддерживать IE?● IE 8 — CSS 2 и JScript (ES 3)● IE 9 — CSS 3 и ES 5
● Пишите для корпоративного сектора?
Поддержка технологий
● Хотите ли поддерживать IE?● IE 8 — CSS 2 и JScript (ES 3)● IE 9 — CSS 3 и ES 5
● Пишите для корпоративного сектора?● IE 8 и Firefox 4 (JavaScript 1.8)
Поддержка технологий
● Хотите ли поддерживать IE?● IE 8 — CSS 2 и JScript (ES 3)● IE 9 — CSS 3 и ES 5
● Пишите для корпоративного сектора?● IE 8 и Firefox 4 (JavaScript 1.8)
● Иначе — зависит от задачи.
БОЛЬ
● IE 8
БОЛЬ
● IE 8● IE 9 + IE 8 Compatibility Mode (CM)
БОЛЬ
● IE 8● IE 9 + IE 8 Compatibility Mode (CM)● IE 10 + IE 9 CM + IE 8 CM
БОЛЬ
● IE 8● IE 9 + IE 8 Compatibility Mode (CM)● IE 10 + IE 9 CM + IE 8 CM● IE 11 …
БОЛЬ
● IE 8● IE 9 + IE 8 Compatibility Mode (CM)● IE 10 + IE 9 CM + IE 8 CM● IE 11 …● А еще есть Quirks Mode
БОЛЬ
● IE 8● IE 9 + IE 8 Compatibility Mode (CM)● IE 10 + IE 9 CM + IE 8 CM● IE 11 …● А еще есть Quirks Mode● И Doctype
БОЛЬ
● IE 8● IE 9 + IE 8 Compatibility Mode (CM)● IE 10 + IE 9 CM + IE 8 CM● IE 11 …● А еще есть Quirks Mode● И Doctype● И x64
БОЛЬ
Браузероспецифичное
● Какие есть плюшки?
● Какие есть плюшки?● Cross-domain запросы● Постоянное хранилище данных● Доступ к файловой системе● Работа с периферийными устройствами● NPAPI● … и т. д. и т. п.
Браузероспецифичное
Кросс-браузерность
Как быть?
● Писать отдельно под каждый браузер
Как быть?
Кросс-браузерность
● Писать отдельно под каждый браузер● Унифицировать разработку
Как быть?
Кросс-браузерность
● Писать отдельно под каждый браузер● Унифицировать разработку
● Разделение на Background и Foreground● Greasemonkey● Комбинированный подход
Как быть?
Кросс-браузерность
Greasemonkey
● Greasemonkey — расширение Mozilla Firefox, позволяющее добавить на любую страницу пользовательский JavaScript, записанный в формате этого расширения.
● Пример заголовка:// ==UserScript==// @include http://www.example.com/foo/*// @exclude http://www.example.com/foo/baz// @include /^https?://www\.example\.com/.*$/// ==/UserScript==
Ну вот и все
Что делать новичку?
Ну вот и все
● Написать расширение под любимый браузер● Использовать семейство Greasemonkey● Взять готовый framework
● Kango● BabelExt
● Использовать web решения● сrossrider.com● сrossbrowser.com
Что делать новичку?
Вопросы?
WAT?WAT?
