Обновить
128K+

JavaScript *

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

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

Нативная разработка vs кросс-платформенная — нужно ли выбирать?

Время на прочтение5 мин
Охват и читатели16K
Привет, Хабр! Сегодня мне хотелось бы остановиться на вопросе выбора между нативной и кроссплатформенной разработкой для мобильных приложений. Как показала практика, это актуальная дилемма как для заказчиков, так и для начинающих разработчиков, которые хотят приобрести наиболее полезный опыт для дальнейшей карьеры. Так что делюсь под катом опытом нашего отдела и некоторыми выводами, которые мы сделали для себя.


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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №418 (1 — 7 июня 2020)

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

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

Как ускорить игру «Жизнь» в сто раз

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

Сложно найти человека, не знакомого с игрой "Жизнь", придуманной английским математиком Джоном Конвеем еще в 1970 году, и до сих пор не теряющей своей популярности. Многие программисты писали свою реализацию этой игры, и еще одна вряд ли кого-то удивит. Однако эта игра является отличным примером, показывающим, насколько полезной может оказаться оптимизация вычислений, даже не меняющая асимтотическую сложность алгоритма. Мы начнем с простейшей реализации на c# и будем последовательно применять различные оптимизации, ускоряя работу программы.

Мы также улучшим алгоритм на JavaScript, ускорив его в 10 раз по сравнению с неоптимизированной версией.

В конце статьи дана ссылка на код, а также на online-реализацию игры с оптимизированным алгоритмом на JavaScript, выполняющим до двухсот итераций в секунду на поле размера 1920x1080 (Full HD), где вы можете убить время поиграть в эту замечательную игру.
Читать дальше →

Создание эффекта быстрого полета сквозь космос (или падающего снега) за 10 минут на p5.js

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

Недавно под вдохновением от канала The Coding Train я решил поучаствовать в одном из 10-минутных челленджей, в котором нужно было создать иллюзию полета сквозь космос с большой скоростью.

Для реализации проекта я выбрал уже хорошо знакомый мне p5.js — библиотеку для JavaScript, предназначенную для создания арта алгоритмическим способом. Почему нельзя было для этого использовать стандартные графические пакеты от Adobe?

Во-первых, делать такое кодом — это красиво.

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

Ну и в-третьих, этот код потом легко интегрировать в любой веб-проект в виде скрипта на JS.

Ну что же, в бесконечность и далее…
Читать дальше →

МК-61: история, эмуляция, устройство

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

Расцвет эпохи программируемых калькуляторов в нашей стране пришёлся на середину 80-х годов. Потом на смену относительно сытым и благополучным временам пришла эпоха бандитского капитализма, когда стране стало не до выпуска своей высокотехнологичной продукции бытового назначения, вот уже сменились поколения, но ностальгия по тем временам, когда мы бессонными ночами пытались сократить код программы хотя бы на пару байтов, чтобы уместить задуманную функцию, выискивали всё новые и новые недокументированные возможности, придумывая способы, как их можно использовать на практике, сочиняли целые циклы рассказов в качестве фона для наших игровых программ, не даёт забыть свой МК-61 со 105 байтами программной памяти. Поэтому хочу написать заметку о том, что собой представляли и как работали эти самые программируемые калькуляторы. Даже если эта тема сегодня периодически и поднимается, то не настолько часто, чтобы приесться уважаемому читателю, так что надеюсь поведать что-то новое.

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

Vuex – решаем старый спор новыми методами

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

Во Vuex есть одна популярная практика — не использовать mapState и mapMutations. Вообще. Вместо это мы сразу же при создании нового значения в store делаем для него геттер, а для каждой мутации – экшен.


Что-то наподобие:


export default new Vuex.Store({
  state: {
    // 1
    count: 0
  },
  getters: {
    // 1
    count: (state) => state.count
  },
  mutations: {
    // 2
    increment(state) {
      state.count++;
    }
  },
  actions: {
    // 2
    increment({ commit }) {
      commit('increment');
    }
  }
});

Холивара не избежать. Это уже доказала вот эта статья. Опять в интернете кто-то не прав, и я должен доказать почему. И я докажу.

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

Как пройти собеседование в GitLab, попасть в команду разработчиков Vue и стать Staff-engineer

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


В конце мая в нашем инстаграм-аккаунте выступала Наталья Теплухина — Vue.js core team member, GoogleDevExpret и фронтенд-разработчица. Мы анонсировали ее как Senoir, но за неделю до прямого эфира ее повысили и она стала первым Staff Frontend Engineer в Gitlab.

Наташа рассказала, как попасть в команду разработки фреймворка Vue, о его будущем, как попасть в Gitlab, почему джунам не стоит идти на удаленку, и о синдроме красной ручки, которыми страдают русскоязычные команды разработки.

Делимся расшифровкой и записью эфира.

Машинное обучение с подкреплением через соревновательные нейронные сети

Время на прочтение3 мин
Охват и читатели9.6K
В классической игре «крестики-нолики» существует возможность представить все вероятные ходы — и никогда не проигрывать. Эту возможность я использовал как метрику своего обучения нейронной сети игре.

Обучение с подкреплением будет полезным для задач с принятием неоднозначного решения, осложнённого из-за множества вариантов выбора действия с различными исходами для каждого.

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

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


Ссылки:
Запись игры обученной сети
Обучить сеть с нуля
Исходники

Также можно ввести предобученную модель из GitHub по нажатию на соответствующую кнопку, чтобы сразу начать испытывать нейронную сеть.
Читать дальше →

Переработка архитектуры React Native в 2020 году

Время на прочтение5 мин
Охват и читатели15K
Фреймворк React Native (RN) появился в 2015 году. Он предназначен для разработки кросс-платформенных мобильных приложений с использованием библиотеки React. Эти приложения поддерживают нативные возможности платформ, для которых их создают. У исходной архитектуры React Native были определённые недостатки. Но, несмотря на это, RN получил хорошую поддержку сообщества, его популярность постепенно росла, не в последнюю очередь — благодаря громкой репутации React.



О проекте по перепроектированию архитектуры React Native заговорили в 2018 году. Этой работой занимается команда Facebook. Цель перепроектирования заключается в том, чтобы сделать фреймворк более стабильным, и в том, чтобы решить наиболее распространённые проблемы, накопившиеся в RN за годы разработки. Материал, перевод которого мы сегодня публикуем, посвящён рассмотрению того, как переработка архитектуры RN способна улучшить производительность приложений и скорость работы программистов.
Читать дальше →

CRUD API на Deno и PostgreSQL: работаем с динозавром

Время на прочтение8 мин
Охват и читатели3.5K
Всем привет. В преддверии старта курса «Fullstack разработчик JavaScript», хотим поделиться интересным материалом, который прислал наш внештатный автор. Данная статья не имеет отношения к программе курса, но наверняка будет интересна, как небольшой обзор на Deno.





"-Райан, мы тут концепцию CLI команд для Deno продумываем. Сколько флагов для secure runtime добавить?"
"-Да"
"-Райан, нам надо придумать символ языка, чтобы все понимали, что мы делаем что-то прям новое. Какое животное выберем?"
"-Динозавра"
Читать дальше →

Наложение 2d-текстуры на 3d-объект с использованием p5.js (часть 2 — наложение паттерна на куб)

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

Это вторая часть проекта, в которой мы накладываем динамический 2d-паттерн на 3d-объект. Вы можете начать с первой части (Часть 1) или просто скопировать итоговый код несколькими абзацами ниже.

Некоторое время назад я создал паттерн, который генерировался при помощи нескольких строк кода в библиотеке p5.js.
p5.js — это библиотека для Javascript, созданная в 2014 году. Ее основная цель — стать окном в мир программирования для дизайнеров, художников, учителей и прочих представителей творческих профессий. Он поддерживает и анимацию, и схемы, легко переводится в веб-формат.

Сейчас я расскажу, как сделать финальную часть — наложить паттерн на 3d-объект (в данном случае — куб).
Читать дальше →

Vite – ведение разработки без бандлов на Vue

Время на прочтение2 мин
Охват и читатели19K
Привет, хабровчане. В июне OTUS запускает курс «Vue.js разработчик». В преддверии старта курса мы традиционно подготовили перевод интересного материала.





Однажды Эван Ю (создатель Vue.js) решил не поспать ночью и в итоге создал Vite.



Vite позволяет вам создавать приложения на Vue с однофайловыми компонентами без шага сборки бандлов. Импорты запрашиваются браузером как нативные модули ES. Dev-сервер перехватывает запросы к файлам .vue и компилирует их на лету. И это происходит мгновенно.

Обратите внимание, что Vite – это пока экспериментальное решение, и я не знаю, что случится в будущем и насколько долго эта статья будет оставаться полезной. Относитесь к этому как к аперитиву или как просто к чему-то веселому.
Читать дальше →

TS-Serializable 2: с конвертации свойств из snake case и декоратором вместо наследования

Время на прочтение3 мин
Охват и читатели3.1K
Недавно мне повезло попасть на проект бэкенд которого написан на php. А как принято у php бекэндов json с ответом они отправляют в snake case стиле. И как следствие вся работа с данными на фронте происходила в перемешку в camel case и snake case стилях. Для решения этой проблемы была доработана библиотека сериализации ts-serializable. Теперь при получении данных из json их можно приводить к принятому в js стилю camel case, а при отправке на сервер возвращать в snake case.

ts-serializable

Так же после выхода первой версии у некоторых пользователей были пожелания по функционалу. Эти пожелания реализованы в новой версии.
Читать дальше →

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

Змеиный сахар или пишем свой range в JavaScript

Время на прочтение2 мин
Охват и читатели6.7K
Многие любят Python… Новички восщищаются отсутствием точек с запятой, а продвинутые радуются действительной простотой. Сегодня речь и пойдет о том, как в JavaScript реализовать подобие той самой простоты Python, а конкретно функцию range.

В Python по функции range можно итерировать или, например, преобразовать в массив — list(range(begin, end)).

Но вопрос в том, можно ли мощностями JavaScript создать что-то подобное и при этом, чтобы решение выглядело нативным и простым?

Первое, что приходит в голову — написать подобный класс:

function range(from, to, step = 1){
    this.current = from
    this.to = to
    this.step = step

    this.next = () => (this.current += step) % to
}
Читать дальше →

Наложение 2d-текстуры на 3d-объект с использованием p5.js (часть 1 — создание паттерна)

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

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

При этом есть достаточно простая библиотека p5.js, с помощью которой можно создать сложные эффектные паттерны буквально нескольким десятком строк кода. Я недавно создавал такой проект и теперь хочу привести пример.

Проще всего начать с создания нового проекта в онлайн редакторе editor.p5js.org
Читать дальше →

Как воссоздать эффект муарового узора в библиотеке p5.js для новичка (быстрый гайд)

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

Муаровый узор — это оптическая иллюзия, возникающая при наложении двух периодических сетчатых рисунков. Повторяющиеся элементы двух рисунков то накладываются друг на друга, то образуют промежутки.

В обычной жизни мы часто сталкиваемся с ним, например, когда смотрим на тюлевые занавески. Что неудивительно — само французское название Moire исходно обозначало похожий тип шелковой ткани.

image

Этот эффект можно часто наблюдать в самых разных сферах — от фотографии до радиологии и мореходства.

Чтобы добиться возникновения этого эффекта, а заодно попрактиковаться в p5.js, я решил написать простой код, который его воссоздает.

p5.js — это библиотека для Javascript, созданная в 2014 году. Ее основная цель — стать окном в мир программирования для дизайнеров, художников, учителей и прочих представителей творческих профессий. Он поддерживает и анимацию, и схемы, легко переводится в веб-формат.
Читать дальше →

Обнаружение бездействующих пользователей с помощью API Idle Detection

Время на прочтение7 мин
Охват и читатели11K
Статья, перевод которой мы сегодня публикуем, посвящена новому API Idle Detection. Этот API уведомляет разработчиков при бездействии пользователя, указывая на то, что пользователь не работает с клавиатурой, мышью, экраном. API сообщает об активации хранителя экрана, о блокировке экрана, о переходе пользователя на другой экран. Разработчик при этом может настроить пороговые уровни показателей активности пользователя, достижение которых вызывает срабатывание API.


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

Красота прогрессивных улучшений

Время на прочтение6 мин
Охват и читатели9.3K
Компания Nokia выпустила обновлённую версию легендарного телефона Nokia 3310 примерно 3 года назад. Я вполне мог его себе позволить (стоил он совсем недорого), поэтому я таким телефоном обзавёлся. Он оснащён двухмегапиксельной камерой и батареей, которой хватает на 30 дней (до 22 часов разговоров). Он поддерживает 2G-сети, оборудован 16 мегабайтами памяти, в нём есть классическая игра «Змейка» и браузер.


Телефоны Nokia 3310

Как создавать сайты, которые будут хорошо работать на таком телефоне?
Читать дальше →

Metastocle — децентрализованное хранилище данных

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

image


Что делать, если нужно хранить разнообразные данные децентрализованно? Объекты, массивы, даты, числа, строки, да что угодно. Обязательно ли придумывать мощную СУБД для этого? Ведь часто нам просто нужно хранить и получать данные распределенно, открыто, но максимально просто и без особых притязаний.


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

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

HLS в MP4 с помощью ffmpeg в браузере

Время на прочтение4 мин
Охват и читатели11K
Привет! Уже более двух месяцев я в свободное время пилю веб приложение для преобразования HLS и DASH в MP4, используя emscripten и ffmpeg, от чего хочется поделиться тем, как у меня это получилось сделать.

В этой статье я не буду приводить исходный код правок и патчей ffmpeg, т.к. большая их часть была сделана на коленке, а я не очень хорош в C. Но сейчас достаточно статей которые вам помогут.
Читать дальше →