This week we issue a really huge selection of all the essential news you might have missed on Front-end development. Make sure to check the latest updates on CSS, HTML, and JavaScript.
Рубрика «javascript» - 94
Frontend Weekly Digest (29 July – 4 August 2019)
2019-08-04 в 19:20, admin, рубрики: angular, css, digest, ES6, html, html5, javascript, JS, links, React, vue, Разработка веб-сайтовVueJs + VueRouter + modal. Очередной велосипед
2019-08-04 в 15:10, admin, рубрики: javascript, mod dialog, vuejs, vuejs2Добрый день. В этой статье я разберу способ, который позволяет при смене адреса показывать модальное окно для наших нужд. Я знаю, что есть собственное решение для компонента «modal» на офф сайте (https://ru.vuejs.org/v2/examples/modal.html). Вдобавок к этому на хабре есть много других статей, посвященных теме модальных окон во VueJs (например, https://habr.com/en/post/350232/).
Однако, на мой взгляд, каждый из них имеет свои минусы, например:
- в случае изложенном на офф сайте компоненты нужно создавать отдельную переменную и привязываться к ней;
- во второй статье рассматриваются решения сторонних разработчиков. В этом случае нужно потратить время и разобраться как использовать эти компоненты + лишние, на мой взгляд, зависимости в проект. А я придерживаюсь позиции: чем проще, тем лучше.
Опять же, я всего знать не могу, поэтому, если если у вас есть что сказать или отметить, то я открыт к конструктивной критике. Далее мы будем использовать исключительно стандартный функционал инструментов, которые используем (Vue, VueRouter, Bootstrap Modal). Итак, ближе к делу…
Читать полностью »
Асинхронное программирование в JavaScript (Callback, Promise, RxJs )
2019-08-03 в 15:29, admin, рубрики: angular, callback, event loop, javascript, node.js, observable, promise, rxjs, асинхронность, очередь, реактивное программирование, стек, Учебный процесс в ITВсем привет. На связи Омельницкий Сергей. Не так давно я вел стрим по реактивному программированию, где рассказывал про асинхронность в JavaScript. Сегодня я бы хотел законспектировать этот материал.
Но перед тем как начать основной материал нам нужно сделать вводную. Итак, давайте начнем с определений: что такое стек и очередь?
Стек — это коллекция, элементы которой получают по принципу «последний вошел, первый вышел» LIFO
Очередь — это коллекция, элементы которой получают по принципу («первый вошел, первый вышел» FIFO
Окей, продолжим.
JavaScript — это однопоточный язык программирования. Это значит, что он имеется только один поток выполнения и один стек, в который помещаются функции в очередь на выполнение. Следовательно в один момент времени JavaScript может выполнить только одну операцию, другие операции при этом будут ждать своей очереди в стеке, пока их не вызовут.
Травим данные с travajs
2019-08-01 в 15:10, admin, рубрики: javascript, open source, валидация, зеленая, на здоровье, Разработка веб-сайтов, трава
В своем предыдущем посте я описал основные моменты при разработке другой opensource библиотеки. Забыл упомянуть еще один: если никому не рассказывать про библиотеку, какая бы нужная она ни была, скорее всего никто про нее так и не узнает.
Итак, встречайте trava.js — сочная валидация на пользу проекту. К слову траву мы используем уже больше полугода, и я подумал, пришло время рассказать вам о преимуществах ее использования. Уже даже подсушили, так что задержите дыхание. И вперед.
Читать полностью »
JavaScript – это один из языков с динамической типизацией. Такие языки удобны для быстрой разработки приложений, но когда несколько команд берутся за разработку одного большого проекта, лучше с самого начала выбрать один из инструментов для проверки типов.
Можно начать разрабатывать код на TypeScript или включить в проект Flow. TypeScript – это компилируемая версия JavaScript, разработанная компанией Microsoft. Flow, в отличие от TypeScript, это не язык, а инструмент, который позволяет анализировать код и проверять типы. В сети можно найти множество статей и видео об этих подходах, а также руководство по тому, как начать использовать типизацию. В этой статье мы бы хотели рассказать, почему нам не подошел Flow, и как мы начали переходить на Typescript.
Читать полностью »
Работа с Worker “как хочется“, а не “как можно”
2019-08-01 в 12:14, admin, рубрики: javascript, TypeScript, web-разработка, worker, Блог компании WavesВ этой статье будет использоваться ГРЯЗНЫЙ, небезопасный, "костыльный", страшный и т. д. метод eval. Слабонервным не читать!
Сразу скажу, что некоторые проблемы удобства использования решить не удалось: в коде, который будет передан в worker, нельзя использовать замыкание.
Технологии, которые будут популярны в 2020 году
2019-08-01 в 12:11, admin, рубрики: graphql, javascript, pwa, React, Rust, webassembly, Блог компании Цифровые Экосистемы, Исследования и прогнозы в IT, прогнозы, Программирование, тренды, языки программирования
Хоть это и кажется невероятным, 2020 год уже вот-вот наступит. Эта дату мы до сих пор воспринимали как нечто сошедшее со страниц научно-фантастических романов, и тем не менее, дела обстоят именно так — до 2020 года совсем рукой подать.
Если вам любопытно, каким может оказаться будущее для мира программирования, то вы по адресу. Возможно, я ошибаюсь по каждому пункту — не считайте мои слова непогрешимой истиной — однако ниже я изложу свои соображения о том, что нас ждет. Дара провидения у меня нет, но я могу сделать некоторые предположения на основании доступных данных.
Читать полностью »
Уместить звездное небо на WebGL в 1009 байт JavaScript
2019-08-01 в 11:41, admin, рубрики: javascript, js1k, WebGL, оптимизация, Спортивное программирование, фракталыДве вещи наполняют душу всегда новым и все более сильным удивлением и благоговением, чем чаще и продолжительнее мы размышляем о них, — это звездное небо надо мной и моральный закон во мне. Иммануил Кант
JS1k — ежегодное соревнование, где надо вместить демо, игру или все что угодно, в 1024 символа на JavaScript. В этом году мое демо заняло четвертое место (до третьего не хватило каких-то два балла). Посмотреть демо можно на сайте JS1k. У кого не открывается или не работает, выглядеть должно так:
Минифицированный и полный исходный код лежит на github. А под катом разбор того, как сейчас минифицируют JavaScript для таких конкурсов.
Обходим лимит поиска LinkedIn, играя с API
2019-08-01 в 10:41, admin, рубрики: api, javascript, limit, linkedin, reverse engineering, реверс-инжиниринг, Социальные сети и сообщества, хранение данныхЛимит
Есть на LinkedIn такое ограничение — Лимит коммерческого использования. Крайне вероятно, что вы, как и я до недавнего времени, никогда не сталкивались и не слышали о нем.
Суть лимита в том, что если вы используете поиск людей вне ваших контактов слишком часто (точных метрик нет, решает алгоритм, на основе ваших действий — как часто и много искали, добавляли людей), то результат поиска будет ограничен тремя профилями, вместо 1000 (по умолчанию 100 страниц, по 10 профилей на страницу). Лимит сбрасывается в начале каждого месяца. Естественно, премиум аккаунты такого ограничения не имеют.
Но не так давно, для одного пет-проекта, я начал много играться с поиском на LinkedIn и внезапно получил это ограничение. Естественно, такое мне не очень понравилось, ведь я не использовал его в каких-либо коммерческих целях, поэтому первой мыслью было изучить ограничение и попытаться его обойти.
Читать полностью »
Что ты такое, Event Loop? Или как устроен цикл событий в браузере Chrome
2019-08-01 в 9:49, admin, рубрики: event loop, javascript, requestAnimationFrame, web api, браузеры, цикл событийКак думаете, что произойдет, если запустить в консоли браузера этот фрагмент кода?
function foo() {
setTimeout(foo, 0);
}
foo();
А этот?
function foo() {
Promise.resolve().then(foo);
}
foo();
Если вы также, как и я, прочитали кучу статей про Event Loop, Main Thread, таски, микротаски и прочее, но затрудняетесь ответить на вопросы выше — эта статья для вас.
Читать полностью »