Pull to refresh
@simple_mortalread⁠-⁠only

User

Send message

CTF — для начинающих

Level of difficultyEasy
Reading time3 min
Views7.6K

CTF «захватить флаг» - секретный код, который в реальной жизни мог бы хранить ценные данные. Побеждает тот, кто быстрее и эффективнее решит задачи, демонстрируя свои навыки.

Читать далее
Total votes 6: ↑6 and ↓0+6
Comments2

Подробное описание операторов RxJS — Часть 1

Reading time6 min
Views13K

Первое, что нужно понять об операторах, - это почему они существуют. Они существуют, потому что observables как тип позволяют нам обрабатывать события (или значения во времени) как множества или набор вещей.

Говоря более просто, любое четко определенное множество будет иметь операции, которые могут быть выполнены с ним, которые могут преобразовать его в новое множество того же типа. Например, предположим, что у нас есть грузовик с яблоками. Мы могли бы превратить его в грузовик с нарезанными яблоками с помощью машины для нарезки яблок. Та же самая машина для нарезки яблок затем может быть использована на любом грузовике с яблоками, чтобы превратить их в грузовик, загруженный нарезанными яблоками. В этом случае машина для нарезки яблок будет считаться «оператором», который сопоставляет яблоки с ломтиками яблок. Точно так же мы могли бы иметь грузовик с сахаром, мукой, яйцами и т. д. И объединить их с грузовиком с ломтиками яблока, чтобы сделать грузовик с яблочными пирогами, используя какую-то машину для производства пирогов. Итак, в этом примере грузовик - это тип множества, машина для нарезки яблок или машина для изготовления пирогов будут «операторами», а сахар, яблоки, ломтики яблок, яйца и т. д. Будут просто значениями, переносимыми нашим типом множества.

Читать далее
Total votes 8: ↑5 and ↓3+3
Comments0

Приёмы ускорения кода на JS и других языках: подборка от разработчика поиска Яндекса

Reading time17 min
Views68K
Привет! Меня зовут Виктор Хомяков, в Яндексе я работаю над скоростью страниц поиска. Однажды мне в голову пришла идея обобщить свой опыт и систематизировать приёмы ускорения работы кода на JavaScript. То, что получилось в итоге, собрано в этом материале.

Некоторые из приёмов будут полезны и тем, кто пишет на других языках. Все способы разделены на группы по убыванию специфичности: от наиболее общих до конкретных. Почти все примеры кода взяты из реальных проектов, из реального продакшена.


Читать дальше →
Total votes 80: ↑80 and ↓0+80
Comments51

Пятёрочка — Интегрируй меня полностью

Reading time23 min
Views9.8K

Мы в KTS делаем проект для Пятерочки – новый личный кабинет сотрудника. Продукт объединяет уже существующие сервисы и автоматизирует бизнес-процессы, которые раньше выполнялись вручную.

Над личным кабинетом работает много команд, поэтому нужен удобный механизм параллельной разработки модулей-микрофронтендов. Мы попробовали три способа встраивания: iframe, NPM-пакеты и Webpack Module Federation. В статье анализируем преимущества и недостатки каждого из них и рассказываем, почему переходили от одной технологии к другой.

Поехали!
Total votes 10: ↑10 and ↓0+10
Comments10

Изучай observable, создавая observable

Reading time7 min
Views37K

Эта статья — перевод оригинальной статьи Ben Lesh “Learning Observable By Building Observable”.

Ben Lesh рассказывает как создать свой observable и сравнивает его работу с observable из RxJs.

Читать далее
Total votes 8: ↑8 and ↓0+8
Comments2

Для программиста shell так же необходим, как умение читать

Reading time4 min
Views17K
Грамотное владение shell — один из самых важных навыков, которыми вы как программист должны обладать. Unix shell — одна из самых мощных идей, реализованных в коде, и она должна стать вашей второй натурой. Ни один другой инструмент и близко не сравним с возможностью быстрого выполнения сложных задач или с сохранением этих команд в виде скриптов.

В своей работе я использую Vim в качестве редактора, а Unix — в качестве «IDE». Я не модифицирую свой vimrc, чтобы добавить в него функции IDE; самый важный плагин, который использую ежедневно — это Ctrl+P, и он нужен мне только для упрощения открытия файлов. Грамотное владение Vim — ценный навык, но важно понимать, когда от него нужно отказаться. В своей повседневной работе я взаимодействую с несколькими терминалами: обычно в одном из них есть Vim, второй используется для запуска сборок или демонов, а в третьем запущен shell, способный выполнить любые мои команды.



Постоянно открытый shell позволяет мне выполнять сложные задачи и отвечать на сложные вопросы. Интересные вещи я нахожу при помощи git grep, масштабные операции поиска и замены я выполняю через sed, отвечаю на вопросы с помощью awk, а более тонкие задачи я выполняю создаваемыми по ходу работы командами и конвейерами shell. Я обладаю свободой творческого решения задач без ограничений, заложенных проектировщиками IDE.
Читать дальше →
Total votes 35: ↑29 and ↓6+32
Comments72

Создание нейронной сети Хопфилда на JavaScript

Reading time8 min
Views15K

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

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

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

Читать много кода
Total votes 15: ↑15 and ↓0+15
Comments2

Полное руководство по CSS Flex + опыт использования

Reading time6 min
Views54K

Как и CSS Grid, Flex Box довольно сложен, потому что состоит из двух составляющих: контейнера и элементов внутри него.

Когда я начал изучать Flex, я хотел увидеть все, на что он способен. Но мне не удалось найти подробное руководство с примерами всех возможностей. Поэтому я решил самостоятельно создать диаграммы свойств Flex с «высоты птичьего полета».

Читать!
Total votes 14: ↑11 and ↓3+13
Comments13

Использование ECMAScript-модулей в Node.js

Reading time6 min
Views22K
ECMAScript-модули (кратко их называют ES-модулями) — это модули, формат которых описан в стандарте ECMAScript, при работе с которыми используются инструкции import и export:

// ECMAScript-модуль

// инструкция import
import myFunc from './my-func';

//инструкция export
export myOtherFunc(param) {
  const result = myFunc(param);
  // ....
  return otherResult;
}

В Node.js, начиная с версии 13.2.0, имеется стабильная поддержка ES-модулей.



Этот материал посвящён особенностям работы с ES-модулями в Node.js.
Читать дальше →
Total votes 27: ↑25 and ↓2+33
Comments4

Разворачиваем Node.js-проект (Nuxt.js) на базе VDS с ОС Ubuntu Server

Reading time7 min
Views27K

Доброго времени суток, хабровчане!

В данной статье я рассмотрю вопрос развертывания с нуля NuxtJS-проекта (либо любого другого проекта на NodeJS) на VDS-сервере с использованием веб-сервера Apahce2, Node.js, менеджера процессов pm2 с полным циклом установки всех компонентов.

Установка будет производится на чистом VDS-сервере, не имеющем каких-либо настроек.

Читать далее
Total votes 3: ↑3 and ↓0+3
Comments12

TypeScript: Раскладываем tsconfig по полочкам. Часть 2 — Всё про строгость

Reading time18 min
Views36K

В данной статье я хочу предоставить переработанную и упорядоченную выжимку документации по настройке "флагов строгости" tsconfig.json. Статья будет полезна как тем, кто только начинает работать с TypeScript, так и тем кто уже давно работает, но при этом использует конфиг по умолчанию. Для разработчиков, которые хорошо ориентируются в вопросах строгости в TypeScript статья может открыть некоторые тонкости работы флагов и послужить шпаргалкой.

Читать далее
Total votes 16: ↑16 and ↓0+16
Comments5

Паттерны отложенной инициализации свойств объектов в JavaScript

Reading time6 min
Views13K
Автор статьи, перевод которой мы публикуем сегодня, хочет рассказать о нескольких JavaScript-паттернах, направленных на отложенную инициализацию свойств объектов, для выполнения которой требуется произвести вычисления, создающие серьёзную нагрузку на систему. В основе всех этих паттернов лежит использование дескрипторов доступа — свойств объектов, описываемых парой функций — геттером и сеттером.


Читать дальше →
Total votes 26: ↑23 and ↓3+32
Comments10

Лингвистическая фантастика. Книги, в которых язык больше, чем просто средство для общения

Reading time5 min
Views24K

Обычно когда речь идет про «научную фантастику», то наукой, которая лежит в основе сюжетов выступают физика, биология, может, компьютерные технологии. Что-то из области точных наук. Но некоторые фантасты не спешат идти проторенными путями, предпочитая удивлять читателя. Например, обращаясь к лингвистике и показывая миры или конфликты, в которых слово играет ключевую роль. 

Очень приятно знакомиться с изобретательными способами показать, что речь — это инструмент, причем весьма функциональный и пластичный. На тему необычных языковых систем, вопросов взаимопонимания и того, как слово может влиять на человека (и не только) можно сказать не меньше интересных вещей, чем по поводу искусственного интеллекта или терраформирования Марса. Вот несколько тому примеров.

Читать далее
Total votes 24: ↑22 and ↓2+30
Comments23

Базовая структура HTML-документа с объяснением каждой строчки

Reading time9 min
Views110K
<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width">

  <title>Unique page title - My Site</title>

  <script type="module">
    document.documentElement.classList.remove('no-js');
    document.documentElement.classList.add('js');
  </script>

  <link rel="stylesheet" href="/assets/css/styles.css">
  <link rel="stylesheet" href="/assets/css/print.css" media="print">

  <meta name="description" content="Page description">
  <meta property="og:title" content="Unique page title - My Site">
  <meta property="og:description" content="Page description">
  <meta property="og:image" content="https://www.mywebsite.com/image.jpg">
  <meta property="og:image:alt" content="Image description">
  <meta property="og:locale" content="en_GB">
  <meta property="og:type" content="website">
  <meta name="twitter:card" content="summary_large_image">
  <meta property="og:url" content="https://www.mywebsite.com/page">
  <link rel="canonical" href="https://www.mywebsite.com/page">

  <link rel="icon" href="/favicon.ico">
  <link rel="icon" href="/favicon.svg" type="image/svg+xml">
  <link rel="apple-touch-icon" href="/apple-touch-icon.png">
  <link rel="manifest" href="/my.webmanifest">
  <meta name="theme-color" content="#FF00FF">
</head>

<body>
  <!-- Content -->
  <script src="/assets/js/xy-polyfill.js" nomodule></script>
  <script src="/assets/js/script.js" type="module"></script>
</body>
</html>


Под катом — разбор каждой строчки
Читать дальше →
Total votes 44: ↑36 and ↓8+34
Comments9

JavaScript-классы — это не просто «синтаксический сахар»

Reading time6 min
Views29K
После того, как я прочитал очередную статью, где говорится о том, что JS-классы — это всего лишь «синтаксический сахар» для прототипного наследования, я решил написать материал, призванный (в который раз!) прояснить вопрос о том, почему данное утверждение неверно. Тут я, надеюсь, смогу объяснить разницу между JS-классами и прототипным наследованием, и смогу рассказать о том, почему важно понимать эту разницу.


Читать дальше →
Total votes 39: ↑38 and ↓1+53
Comments25

Основы движков JavaScript: общие формы и Inline кэширование. Часть 1

Reading time9 min
Views20K
Привет, друзья. В конце апреля мы запускаем новый курс «Безопасность информационных систем». И уже сейчас хотим поделиться с вами переводом статьи, которая непременно будет очень полезной для курса. С оригиналом статьи можно ознакомиться тут.

В статье описаны ключевые основы, они являются общими для всех движков JavaScript, а не только для V8, над которым работают авторы движка (Бенедикт и Матиас). Как JavaScript разработчик могу сказать, что более глубокое понимание того, как работает движок JavaScript поможет разобраться в том, как писать эффективный код.


Читать дальше →
Total votes 23: ↑21 and ↓2+19
Comments2

Основы управления памятью в JavaScript: как это работает и какие проблемы могут возникнуть

Reading time8 min
Views32K


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

Но рано или поздно разработчикам все же приходится разбираться с проблемами, связанными с памятью — например, утечками. Ну а разобраться с ними получится лишь тогда, когда есть понимание механизма выделения памяти. Эта статья и посвящена объяснениям. В ней также есть советы о самых распространенных видах утечек памяти в JavaScript.
Читать дальше →
Total votes 12: ↑9 and ↓3+17
Comments9

Как не потеряться в отечественных изданиях «Искусства схемотехники»

Reading time5 min
Views58K

Так сложилось, что количество русскоязычных изданий книги "Искусство схемотехники" почти вдвое больше оригинальных. И это очень сильно запутывает. Особенно, когда дело касается содержания разных оригинальных изданий. Данная статья предназначена для того, чтобы помочь окончательно разобраться в данном вопросе.

Читать далее
Total votes 32: ↑31 and ↓1+51
Comments16

JavaScript: Стек вызовов и магия его размера

Reading time6 min
Views25K

Большинство разработчиков, которые использовали рекурсию для решения своих задач, видели такую ошибку:

RangeError: Maximum call stack size exceeded.

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

Большинство фронтэнд-разработчиков откроют для себя в этой статье что-то новенькое!

Читать далее
Total votes 16: ↑13 and ↓3+14
Comments40

Опыт разработки виджетов для сторонних сайтов

Reading time6 min
Views8.6K

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

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

Читать далее
Total votes 10: ↑10 and ↓0+10
Comments6

Information

Rating
Does not participate
Registered
Activity