- Знай в лицо: движки браузеров
- Уровни поддержки
- Современный DOCTYPE
- Справочники, и как в них искать
- Итого
В этом разделе мы познакомимся с важными терминами и справочниками - тем, что обязательно понадобится при создании веб-приложений.
Знай в лицо: движки браузеров
Иногда в интернет можно встретить названия не браузеров, а их движков. Полезно понимать, что есть что.
- Gecko
- Открытый движок Firefox и некоторых менее известных браузеров от компании Mozilla.
- Webkit
- Общий браузерный движок браузеров Safari и Chrome. Он отвечает за показ HTML/CSS, возможности HTML 5, кроме собственно языка JavaScript. Здесь браузеры расходятся: Chrome использует Google V8, а Safari - свой собственный закрытый движок. Но так как оба этих браузера основаны на Webkit, то между ними много общего.
- Presto
- Закрытый движок браузера Opera.
- Trident
- Закрытый движок браузера Internet Explorer. Trident ужасен в IE6 и IE7, улучшен в IE8, а в IE9 он уже во многом соответствует стандартам..
Уровни поддержки
Иногда кросс-браузерная разработка становится непростым делом, тогда браузеры разделяют по степени поддержки. Например:
- A. Последние версии Firefox, Internet Explorer, Safari/Chrome
- Идеальная поддержка.
- B. Opera и предыдущие версии современных браузеров
- Возможны незначительные «помарки», не ломающие функционал.
- C. Старые браузеры
- Поддерживаются только базовые возможности
- D. Очень старые браузеры, текстовые браузеры
- Не поддерживаются.
В зависимости от целевой аудитории сайта, Opera может включаться в уровень A, классификация может меняться, учитывать мобильные браузеры.
При любой веб-разработке важно определиться, что поддерживается и до какой степени.
Современный DOCTYPE
Как вам, наверное, известно из опыта работы с HTML, существует два режима документа: нормальный Standards Mode и старый Quirks mode. По правде говоря, есть еще и третий режим, который называется Almost Standards Mode,
Браузер выбирает режим в соответствии с директивой DOCTYPE, прописанной в начале HTML документа. Если для вас это новость - про режимы рендеринга можно почитать, например, на википедии, в статье Wikipedia quirks mode page.
Для нас здесь важно одно - HTML обязан начинаться с DOCTYPE. Для современных сайтов подходит и поддерживается всеми браузерами следующий доктайп:
*!* <!DOCTYPE HTML> */!* <html> ... </html>
DOCTYPE влияет не только на HTML/CSS - JavaScript также зависит от него. Использование неподходящего DOCTYPE или его отсутствие может стоить времени на отладку. Просто используйте <!DOCTYPE HTML>.
Справочники, и как в них искать
Есть три основных справочника по JavaScript на английском языке:
- Mozilla Developer Network — содержит информацию, верную для основных браузеров. Также там присутствуют расширения только для Firefox, они помечены.
Когда мне нужно быстро найти «стандартную» информацию по
RegExp- ввожу в Google «RegExp MDC», и ключевое слово «MDC» (Mozilla Developer Center) приводит к информации из этого справочника. - MSDN — справочник от Microsoft. Там много информации, в том числе и по JavaScript (они называют его «JScript»). Если нужно что-то, специфичное для IE - лучше лезть сразу туда.
Например, для информации об особенностях
RegExpв IE - полезное сочетание: «RegExp msdn». Иногда к поисковой фразе лучше добавить термин «JScript»: «RegExp msdn jscript». - Safari Developer Library](https://developer.apple.com/library/safari/navigation/index.html) — менее известен и используется реже, но в нём тоже можно найти ценную информацию.
Есть ещё справочники, не от разработчиков браузеров, но тоже хорошие:
- http://help.dottoro.com — содержит подробную информацию по HTML/CSS/JavaScript.
- http://javascript.ru/manual — справочник по JavaScript на русском языке, он содержит основную информацию по языку, без функций для работы с документом. К нему можно обращаться и по адресу, если знаете, что искать. Например, так: http://javascript.ru/RegExp.
- http://www.quirksmode.org — информация о поддержке тех или иных возможностей и несовместимостях.
Для поиска можно пользоваться комбинацией «quirksmode onkeypress» в Google.
Спецификация ECMAScript
Спецификация(формальное описание синтаксиса, базовых объектов и алгоритмов) языка Javascript называется ECMAScript.
Ее перевод есть на сайте в разделе стандарт языка.
Вы можете спросить: «Почему стандарт для JavaScript не называется просто JavaScript, зачем существует какое-то отдельное название?»
Все потому, что JavaScript™ - зарегистрированная торговая марка, принадлежащая корпорации Oracle.
Название «ECMAScript» было выбрано, чтобы сохранить спецификацию независимой от владельцев торговой марки.
Спецификация может рассказать многое о том, как работает язык и это основной источник информации.
Мы живем во время, когда все быстро изменяется. Современный стандарт - это ECMA-262 5.1 (или просто ES5), поддерживается всеми современными браузерами, кроме IE<9.
Старый стандарт ECMA 262 3-я версия (ES3) есть в архиве и поддерживается всеми браузерами.
Если вы хотите изучить, как работает язык изнутри, то лучше изучать более новый стандарт, но не забывайте, что некоторые возможности еще не поддерживаются браузерами. Вы можете найти список поддерживаемых браузеров/возможностей на http://kangax.github.com/es5-compat-table/.
ES5 в ряде мест отличается от ES3 и меняет поведение браузера. Чтобы старые скрипты не ломались, браузер включает поддержку нового, несовместимого поведения при указании в коде специальной метки "use strict":
"use strict"; // этот код будет работать по стандарту ES5
Спецификации HTML5
JavaScript - язык общего назначения, поэтому в спецификации ECMAScript нет ни слова о браузерах.
Все, что их касается описано в семействе стандартов HTML5.
Официальная W3.org DOM спецификация большая, но очень полезная. Используйте ее в качестве авторитетного источника, когда доберетесь до работы с документом.
На сайте w3.org масса информации, но найти в ней то, что нужно, может быть нелегко, особенно когда неизвестно в каком именно стандарте искать. Самый лучший способ — Google с указанием сайта. Например, для поиска document.cookie: "document.cookie site:w3.org".
Итого
Итак, посмотрим какие у нас есть источники информации.
Справочники:
- Mozilla Developer Network — информация для Firefox и большинства браузеров.
Google-комбо:"RegExp MDC", ключевое слово «MDC». - MSDN — информация по IE.
Google-комбо:"RegExp msdn". Иногда лучше добавить термин «JScript»:"RegExp msdn jscript". - Safari Developer Library — информация по Safari.
- http://help.dottoro.com — подробная информация по HTML/CSS/JavaScript с учетом браузерной совместимости.
Google-комбо:"RegExp dottoro". - http://javascript.ru/manual — справочник по JavaScript на русском языке. К нему можно обращаться и по адресу, если знаете, что искать. Например, так: http://javascript.ru/RegExp.
Google-комбо:"RegExp site:javascript.ru".
Спецификации содержат важнейшую информацию о том, как оно «должно работать»:
- JavaScript, современный стандарт ES5 (англ), и предыдущий ES3 (рус).
- HTML/DOM/CSS — на сайте w3.org.
Google-комбо:"document.cookie site:w3.org".
То, как оно на самом деле работает и несовместимости:
- Смотрите http://www.quirksmode.org/. Google-комбо:
"innerHeight quirksmode".
- MSDN
- Safari Developer Library
- Mozilla Developer Network
- http://help.dottoro.com
- http://javascript.ru/manual
Комментарии
- Приветствуются комментарии, содержащие дополнения и вопросы по статье, и ответы на них.
- Если ваш комментарий касается задачи -- откройте её в отдельном окне и напишите там.
- Комментарии без смысла, с рекламой или не о статье вообще - удаляются.