Обновить
256K+

JavaScript *

Прототипно-ориентированный язык программирования

264,71
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

Вы знаете, что такое трансдьюсеры

Время на прочтение6 мин
Охват и читатели46K

Трансдьюсеры были анонсированы еще в далеком 2014, с тех пор по ним было написано немалое количество статей (раз, два), но ни после одной статьи я не мог сказать, что понимаю трансдьюсеры кристально ясно. После каждой статьи у меня возникало ощущение, что я приблизительно понимаю что-то сложное, но оно все равно оставалось сложным. А потом однажды в голове что-то щелкнуло: "я ведь уже видел этот паттерн, только он назывался иначе!"

Читать дальше →

Runtyper — инструмент для проверки типов при выполнении JavaScript кода

Время на прочтение2 мин
Охват и читатели7.3K

Runtyper — это плагин для Babel, выполняющий проверку типов прямо во время выполнения JavaScript кода. Он обнаруживает некорректные операции, например строгое сравнение строки и числа, и бросает предупреждение в консоль. Это позволяет вам находить ошибки типизации на ранней стадии, при этом не требует дополнительных аннотаций кода.


Runtyper warning example

Читать дальше →

Как я перестал бояться и переизобрел QML

Время на прочтение6 мин
Охват и читатели14K

Что?


Привет, Хабр! Прошло очень много лет, с тех пор как я писал сюда. Надеюсь, время тебя/меня не слишком/слишком потрепало.

Я хотел бы написать о нашем опыте переосмысления идей QML. Qt — прекрасная (по совокупности заслуг) библиотека, и хотя её внутреннее устройство местами вызывает вопросы, но она дала миру не только кросс-платформенный UI тулкит, но и цельный профессиональный набор инструментов: Дизайнер, Креатор, Лингвист, и, конечно же, Qml. Результатом этого переосмысления стал наш скромный проект, который превращает qml в html5/javascript для разных платформ, и даже позволяет собирать простые android приложения используя Cordova.

Qml всегда привлекал нас (небольшую неизвестную группу QML-адвокатов, как мы себя называем, надев монокли и цилиндры) своей абсолютной выразительностью в плане разработки интерфейсов, и поэтому каждый из нас использует их для разработки пользовательских интерфейсов и сайтов.

Мы бы очень хотели, чтобы часть хабр-сообщества, открытая для всего нового, попробовала бы и оценила наши скромные возможности, мы получили фидбек, и смогли бы улучшить наш продукт.

Исходные коды доступны на github, там же лежат исходные коды сайта, примеров и библиотека контролов, которые мы используем для всех своих проектов. Документацию и уроки можно посмотреть на нашем сайте, pureqml.com.
Если вы чего-то не понимаете, можете присоединиться к группе поддержки в Telegram, мы постараемся ответить на все вопросы в реальном времени.

Одно из бесплатных приложений, которые мы сделали, был порт игры Fontanero, она должна быть доступна в маркетах LG/Samsung.

Ну а дальше можно не читать!

Как мы дошли до жизни такой


Всё началось в уже-далеком 2010-ом году, когда мы начали писать встраиваемое ПО (и интерфейс пользователя) в одной крупной корпорации для линейки разношерстных устройств на всевозможных платформах, доступных сейчас: arm, mips, x86, sh4, не хватало только sparc…
Читать дальше →

Как собрать статистику с веб-сайта и не набить себе шишек

Время на прочтение9 мин
Охват и читатели28K

enter image description here


Привет, Хабр! Меня зовут Слава Волков, и я фронтенд-разработчик в Badoo. Сегодня я хотел бы немного рассказать про сбор статистики с фронтенда.


Мы знаем, что аналитика позволяет оценить эффективность работы любого веб-сайта, улучшить его работу, а значит, повысить уровень продаж и усовершенствовать взаимодействие пользователей с сайтом. Проще говоря, аналитика – это способ контроля над процессами, происходящими на веб-сайте. В большинстве случаев для обычных сайтов достаточно установить Google Analytics или «Яндекс.Метрику» – их возможностей вполне достаточно.


Но как быть, когда стандартных средств мониторинга недостаточно? Или когда собираемая статистика должна быть интегрирована в вашу собственную систему аналитики для отображения полноценной картины происходящего между разными компонентами? В таком случае, скорее всего, вам придется разработать свою систему. А вот как лучше отправлять статистику с ваших веб-сайтов, какие проблемы могут при этом возникнуть и как их избежать, я расскажу в этой статье. Заинтересовались? Добро пожаловать под кат.

Пробуем делать web-frontend на Rust (WebAssembly)

Время на прочтение4 мин
Охват и читатели43K

Недавно вышла новость про то, что webassembly теперь включен в firefox 52 из коробки. А потом еще и chrome 57 подтянулся (правда, там вроде бы были какие-то баги с запуском). Я решил, что обязательно надо попробовать.


Для тех, кто не знает, что такое webassembly краткая информация: webassembly (или wasm) — это низкоуровневый язык, который понимают браузеры, и в который можно будет скомпилировать программы, написанные на популярных языках. Это гораздо более выгодно по скорости парсинга и выполнения, чем компилировать эти языки в чистый javascript или какой-нибудь asm.js.


Wasm задумывался в основном для c/c++, но, на удивление, уже все готово, чтобы скомпилировать программу на rust. Давайте сделаем небольшое приложение и посмотрим, что получится. Все это будем компилировать на Ubuntu. Без теоретических деталей, просто "пощупаем".

Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №255 (20 — 26 марта 2017)

Время на прочтение4 мин
Охват и читатели18K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.

Читать дальше →

Эврика! Моменты озарения при изучении React

Время на прочтение5 мин
Охват и читатели22K
Светлана Шаповалова, редактор «Нетологии», перевела статью Тайлера МакГинниса, в которой он перечислил основные моменты озарения, которые возникают при изучении React.

image

Одна из моих главных преподавательских задач — сделать так, чтобы у людей чаще случались моменты озарения. «Эврика!» — это момент внезапного прояснения, когда ранее непонятные факты вдруг обретают смысл. Такое случалось с каждым. Я знаком со многими преподавателями и лучшие из них умеют так преподносить урок, чтобы озарение у учеников возникало намного чаще.
Читать дальше →

Шейдер меха на WebGL 2

Время на прочтение5 мин
Охват и читатели17K

Идея


Новый стандарт WebGL 2 стал недавно доступен в последних версиях Firefox и Chrome, так что возникло желание опробовать некоторые новые возможности. Одна из наиболее полезных и востребованных функций WebGL 2 (и OpenGL ES 3.0, на котором он основан) это дублирование геометрии (англ. instanced rendering). Эта фича позволяет уменьшить количество вызовов отрисовки (draw calls) путем многократной отрисовки одной и той же геометрии с измененными параметрами. Эта функция присутствовала и в некоторых реализациях WebGL 1, но требовала наличия определенного расширения. Наиболее часто эта функция применяется для создания систем частиц и растительности, но также довольно часто она используется для симуляции меха.

Отслеживание js-ошибок с помощью Метрики

Время на прочтение3 мин
Охват и читатели14K

Использование системы отслеживания js-ошибок трудно переоценить. Даже на покрытом тестами сайте возникают js-ошибки, важно их найти и починить. Расскажу как искал подходящее решение.

Читать дальше →

Лучшие доклады HolyJS 2016 Moscow: Доступ открыт

Время на прочтение5 мин
Охват и читатели12K
Прошло три месяца после JavaScript-конференции HolyJS 2016 Moscow, и это значит, что сейчас самое время выложить видеозаписи докладов и составить рейтинг лучших. Напомню, что рейтинг составляется не «экспертным жюри», а участниками в форме обратной связи – более 400 человек ответили на наши вопросы и поставили оценки докладам, которые они слушали.

В этот раз топ подобрался интересный, разнообразный и почти полностью англоязычный. Вы найдете видео о (dev)tools и ServiceWorker'ах, о минимизации кода и роли UX в обойме навыков frontend-разработчика и о многом другом, включая WebVR.



Разнообразие зоопарка инструментов в мире JS не обошло стороной и HolyJS — почти каждый доклад в той или иной степени посвящен какому-либо фреймворку или инструменту, — но обзор для каждого из них дан глубокий и исчерпывающий, не заскучаете.

Непредсказуемые последствия оптимизации производительности Chrome

Время на прочтение1 мин
Охват и читатели16K

Привет! В последнем релизе Chrome обнаружил очень необычное поведение браузера. Это поведение вызывало новые необычные ошибки в моём веб-скрипте. И я решил поделиться, как оптимизируют производительность Chrome, и про то, с какими необычными последствиями можно столкнуться.



Поехали.

Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №254 (13 — 19 марта 2017)

Время на прочтение4 мин
Охват и читатели20K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.


Читать дальше →

Эволюция модульного JavaScript

Время на прочтение20 мин
Охват и читатели45K


Скорее всего, когда Брендан Айк проектировал JavaScript, он не представлял, как эволюционирует его проект спустя двадцать лет. На данный момент вышло уже шесть основных спецификаций языка, и работа над его улучшением до сих пор продолжается.

Не будем лукавить: JavaScript никогда не был идеальным языком программирования. Одним из слабых мест в JS была модульность, а точнее её отсутствие. Действительно, зачем в скриптовом языке, который анимирует падающие на странице снежинки и валидирует форму, заботиться об изоляции кода и зависимостях? Ведь всё может прекрасно жить и общаться между собой в одной глобальной области — window.

С течением времени JavaScript трансформировался в язык общего назначения, так его начали использовать для построения сложных приложений в различных средах (браузер, сервер). При этом нельзя было положиться на старые подходы взаимодействия компонентов программы через глобальную область: с ростом объёма кода приложение становилось очень хрупким. Как результат для упрощения процесса разработки создавались различные реализации модульности.

Эта статья появилась в результате общения с участниками TC39 и разработчиками фреймворков, а также чтения исходных кодов, блогов и книг. Мы рассмотрим следующие подходы/форматы: Namespace, Module, Detached Dependency Definitions, Sandbox, Dependency Injection, CommonJS, AMD, UMD, Labeled Modules, YModules и ES2015 Modules. Кроме того, мы восстановим исторический контекст их появления и развития.
Читать дальше →

Ближайшие события

Я — самозванец

Время на прочтение7 мин
Охват и читатели54K

Писать об этом очень тяжело, даже тяжелее, чем признаться себе в этом. Я писал заявления об увольнении с любимых мест работы, заканчивал отношения, много в чем не преуспел и портил свою репутацию. Но чувства, которые я из-за этого испытывал, были временными: поначалу бывало очень плохо, но через пару месяцев я оставлял это позади и жил дальше. И все же есть одно чувство, от которого мне так и не удалось избавиться за всю свою карьеру: синдром самозванца.

Переведено в Alconost

«Самозванец» — сильное слово, но именно так я чувствую себя на протяжении всей своей карьеры профессионального веб-разработчика. Мне кажется, что я, хоть и не прекращаю учиться каждый день, все равно отстаю. Мне кажется, что меня воспринимают как эксперта там, где я считаю себя затаившейся катастрофой. Я полный самозванец. Мошенник.
Читать дальше →

Новинки JavaScript: Асинхронные итераторы

Время на прочтение5 мин
Охват и читатели23K

В этом небольшом посте я хочу рассказать об одном интересном предложении (англ. proposal) в стандарт EcmaScript. Речь пойдёт об асинхронных итераторах, о том, что это такое, как ими пользоваться и зачем они вообще нужны простому разработчику.


Асинхронные итераторы, это расширение возможностей обычных итераторов, которые с помощью цикла for-of/for-await-of позволяют пробежать по всем элементам коллекции.

Читать дальше →

Когда появится следующий большой язык программирования с точки зрения Дарвина

Время на прочтение9 мин
Охват и читатели43K
Good news everyone!
Futurama


Следующего большого языка программирования не предвидится. По крайней мере, на то нет причин с точки зрения теории эволюции.

Эволюция работает не только в животном мире, но и в любой подходящей среде. Впервые эта идея получила широкое распространение с выходом книги Ричарда Докинза «Эгоистичный ген» в 1976 году. В ней был введен знакомый каждому термин «мем», как пример эволюции в социальной и культурной среде. Языки программирования тоже эволюционируют. А значит их развитие подчиняется принципам эволюции, на основании которых можно сделать предположение о будущем их развитии.

image
Читать дальше →

Асинхронный JavaScript против отложенного

Время на прочтение3 мин
Охват и читатели74K

В моей статье «Понимание критического пути рендеринга» (перевод статьи) я писала о том, какой эффект оказывают JavaScript-файлы на Критический Путь Рендеринга(CRP).


JavaScript является блокирующим ресурсом для парсера. Это означает, что JavaScript блокирует разбор самого HTML-документа. Когда парсер доходит до тега <script> (не важно внутренний он или внешний), он останавливается, забирает файл (если он внешний) и запускает его.

Такое поведение может доставить проблемы, если мы загружаем несколько JavaScript-файлов на странице, так как это увеличивает время первой отрисовки, даже если документ на самом деле не зависит от этих файлов.


К счастью, элемент <script> имеет два атрибута async и defer, которые дают нам возможность контролировать то, как внешние файлы загружаются и выполняются.


Читать дальше →

Web PUSH Notifications быстро и просто

Время на прочтение17 мин
Охват и читатели397K

Добрый день. В этой небольшой заметке я хочу рассказать как быстро и просто настроить push-уведомления на вашем сайте. Эта статья ни в коем случае не претендует на звание исчерпывающего руководства, но, я надеюсь, что она даст точку старта для дальнейшего изучения.


Информации по этой теме в интернете полно, но она фрагментирована, разбросана по разным ресурсам и перемешена с уведомлениями для мобильных устройств с примерами на Java, C++ и Python. Нас же, как веб-разработчиков, интересует JavaScript. В этой статье я постараюсь саккумулировать всю необходимую и полезную информацию.


Web PUSH Notifications


Я думаю, вы уже знаете что такое push-уведомления, но я всё же напишу коротко о главном.


Пользователь, заходя на сайт, вытягивает (pull) с него данные. Это удобно и безопасно, но с развитием интернет ресурсов, появилась необходимость оперативно доставлять информацию пользователям не дожидаясь пока те сами сделают запрос. Так и появилась технология принудительной доставки (push) данных с сервера клиенту.

Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №253 (6 — 12 марта 2017)

Время на прочтение4 мин
Охват и читатели19K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.


Читать дальше →

История о том, как мы перевели проект в почти четверть миллиона строк на TypeScript и остались в живых

Время на прочтение10 мин
Охват и читатели32K
В 2016-м статически типизированный JavaScript оказался крайне востребованным. Теми или иными средствами, позволявшими устранить недостатки динамической природы JS, воспользовались многие компании. Нас тоже привлекла перспектива задействовать огромный потенциал статической типизации в своих разработках.


Выбирая инструменты, мы предварительно остановились на TypeScript и Flow. Хотя проекты эти и различаются, направлены они на решение одной и той же задачи. А именно, позволяя контролировать типы данных, они обеспечивают более совершенную, в сравнении с чистым JS, организацию кода, улучшают возможности рефакторинга, позволяют программистам работать быстрее и увереннее.
Читать дальше →