0 added
0 removed
Original
2026-01-01
Modified
2026-03-10
1
<p>Теги: api, javascript, frontend, обёртки, wrappers, браузер, browser, engine, xml/html, api браузера, селекция api, этапы написания обёртки, накопление статистики, итеративный процесс разработки, xmlhttprequest, websocket, xhr, abstraction layer, фронтенд</p>
1
<p>Теги: api, javascript, frontend, обёртки, wrappers, браузер, browser, engine, xml/html, api браузера, селекция api, этапы написания обёртки, накопление статистики, итеративный процесс разработки, xmlhttprequest, websocket, xhr, abstraction layer, фронтенд</p>
2
<p>Частой практикой в программировании является написание обёрток. Задача обёртки - сброс сложности в программировании, недопущение "расползания" неудачных API по коду: ведь API третьих сторон не всегда идеально подогнаны к решаемой задаче. Мало того, API бывают неудобно спроектированы.</p>
2
<p>Частой практикой в программировании является написание обёрток. Задача обёртки - сброс сложности в программировании, недопущение "расползания" неудачных API по коду: ведь API третьих сторон не всегда идеально подогнаны к решаемой задаче. Мало того, API бывают неудобно спроектированы.</p>
3
<p>Мы каждый день работаем с браузером и для нашей задачи надо взглянуть на него под новым углом.</p>
3
<p>Мы каждый день работаем с браузером и для нашей задачи надо взглянуть на него под новым углом.</p>
4
<h2>Что такое браузер?</h2>
4
<h2>Что такое браузер?</h2>
5
<p>Это движок (engine), машина, выполняющая блочные вычислений над XML/HTML для рендеринга изображения. Код данного движка писался годами и имеет размер в десятки мегабайт кода на C++. Встроенная в движок JavaScript-машина позволяет писать "тонкие" прослойки над API движка браузера.</p>
5
<p>Это движок (engine), машина, выполняющая блочные вычислений над XML/HTML для рендеринга изображения. Код данного движка писался годами и имеет размер в десятки мегабайт кода на C++. Встроенная в движок JavaScript-машина позволяет писать "тонкие" прослойки над API движка браузера.</p>
6
<p>API браузера по ряду причин написаны мягко говоря "криво". Виной тому и исторические причины - движение web-технологий от статического к динамическому WEB, и субъективные - пресловутые "войны браузеров", во время которых IT-гиганты включали в свои браузеры заведомо несовместимые технологии. Одно это уже требовало написание обёрток, чтобы "отвязаться" от особенностей конкретного браузера.</p>
6
<p>API браузера по ряду причин написаны мягко говоря "криво". Виной тому и исторические причины - движение web-технологий от статического к динамическому WEB, и субъективные - пресловутые "войны браузеров", во время которых IT-гиганты включали в свои браузеры заведомо несовместимые технологии. Одно это уже требовало написание обёрток, чтобы "отвязаться" от особенностей конкретного браузера.</p>
7
<p><em>Пресловутые "костыли" к IE приходится ставить и поныне...</em></p>
7
<p><em>Пресловутые "костыли" к IE приходится ставить и поныне...</em></p>
8
<h2>Каковы этапы написания обёртки?</h2>
8
<h2>Каковы этапы написания обёртки?</h2>
9
<p><strong>Первый этап</strong>- селекция API: выбор наиболее полезных и удачных решений, используемых в проекте в дальнейшем.</p>
9
<p><strong>Первый этап</strong>- селекция API: выбор наиболее полезных и удачных решений, используемых в проекте в дальнейшем.</p>
10
<p><strong>Второй этап</strong>- накопление статистики. Здесь следует остановиться подробнее. Ведь именно это и делает процесс разработки итеративным: мы узнаём частоту использования тех или иных функций и программных конструкций, а заем выносим наиболее часто используемые из них в отдельные API, классы или субсистемы.</p>
10
<p><strong>Второй этап</strong>- накопление статистики. Здесь следует остановиться подробнее. Ведь именно это и делает процесс разработки итеративным: мы узнаём частоту использования тех или иных функций и программных конструкций, а заем выносим наиболее часто используемые из них в отдельные API, классы или субсистемы.</p>
11
<p>Точно так же по мере использования программной системы или продукта конечными пользователями, мы узнаём наиболее часто выполняемые пользователями операции, отсюда возникает необходимость адаптировать продукт особенно какое-то время после запуска. И это объективные причины, от которых даже при самом тщательном проектировании не удаётся уйти.</p>
11
<p>Точно так же по мере использования программной системы или продукта конечными пользователями, мы узнаём наиболее часто выполняемые пользователями операции, отсюда возникает необходимость адаптировать продукт особенно какое-то время после запуска. И это объективные причины, от которых даже при самом тщательном проектировании не удаётся уйти.</p>
12
<p><strong>Третий этап</strong>- создание обёртки. Хорошая обёртка должна сбрасывать сложность пользования API, унифицировать вводимый API в соответствии с внутренними требованиями к оформлению кода продукта, покрывать наиболее часто пользуемые случаи и операции.</p>
12
<p><strong>Третий этап</strong>- создание обёртки. Хорошая обёртка должна сбрасывать сложность пользования API, унифицировать вводимый API в соответствии с внутренними требованиями к оформлению кода продукта, покрывать наиболее часто пользуемые случаи и операции.</p>
13
<p>Возьмём, например, часто пользуемые API браузера для передачи данных - это<strong>XHR</strong>(<strong>XMLHttpRequest</strong>) и<strong>WebSocket</strong>. Возможности этих API схожи: и там и там мы посылаем данные серверу, получаем от него ответы, ловим события об ошибках от браузерного движка.</p>
13
<p>Возьмём, например, часто пользуемые API браузера для передачи данных - это<strong>XHR</strong>(<strong>XMLHttpRequest</strong>) и<strong>WebSocket</strong>. Возможности этих API схожи: и там и там мы посылаем данные серверу, получаем от него ответы, ловим события об ошибках от браузерного движка.</p>
14
<p>Значит, можно написать одну логику, которая будет единообразно выполнять такие операции и две небольшие обёртки над<strong>XHR</strong>и<strong>WebSocket</strong>-<strong>abstraction layer</strong>, скрывающий внутренние реализации и различия между<strong>WebSocket</strong>и<strong>XHR</strong>.</p>
14
<p>Значит, можно написать одну логику, которая будет единообразно выполнять такие операции и две небольшие обёртки над<strong>XHR</strong>и<strong>WebSocket</strong>-<strong>abstraction layer</strong>, скрывающий внутренние реализации и различия между<strong>WebSocket</strong>и<strong>XHR</strong>.</p>
15
<p>Хороший разработчик удачно покрывает обёртками пользуемые API. Отсюда высок спрос и высока оплата работы таких специалистов. Кем быть вам и желаем.</p>
15
<p>Хороший разработчик удачно покрывает обёртками пользуемые API. Отсюда высок спрос и высока оплата работы таких специалистов. Кем быть вам и желаем.</p>
16
<p><em>Есть вопрос? Напишите в комментариях!</em></p>
16
<p><em>Есть вопрос? Напишите в комментариях!</em></p>
17
17