Veras IT

2022-06-13 08:54:12 Лучший markdown редактор

Пока я веду данный блок я перепробовал не мало markdown редакторов и со временем я остановился на одном.

По моему авторитетному скромному мнению лучший md редактор - Mark Text.

Почему же именно он ?

1) Удобная работа с таблицами. Не нужно делаь разметку руками.
2) Кроссплатформенность.
3) Быстрый запуск (да, да) есть редакторы что запускаются не очень быстро.
4) Вкладки для работы с несколькими файлами

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

2022-06-11 19:13:10 Мониторинг

Как же мы еще можем отследить использование памяти в js ?

express-status-monitor - библиотека для express, которая позволяет нам смотреть на нагрeзку на сервер в реальном времени и отслеживать сколько памяти использует сервер. Тут можно будет заметить если использование памяти не уменьшается при уменьшении количества запросов. Так же можно отслеживать конкретные маршруты, чтоб отслеживать нагрузку более точечно.

Так же есть плагин для nest js -
nest-status-monitor
- делающий абсолютно то же самое. Открыть/Комментировать

2022-06-09 09:14:24 Утечки памяти js (часть 2)

Теперь поговорим о том почему могут быть утечки памяти и практики по их предотвращению и устранению.

Глобальные переменные

Как только я начал программировать первое что я услышал - глобальные переменные это плохо. И вот одна из причин почему это плохо. Глобальная переменная которая ссылается на корневой узел (window или this) не будет подвергаться сборке мусора т.к. всегда будет оставаться ссылка на эту переменную. Поэтому лучше всего избегать глобальных переменных и использовать 'use strict', в нем будет выпадать ошибка при попытке создать глобальную переменную.

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

Таймеры и обсёрверы

Нужно грамотно использовать setTimeout, setInterval и Observers. Утечка может быть вызвана тем, что ссылки на объекты хранятся в их обратных вызовах без правильной обработки. По окончанию таймера нужно всегда проводить их очистку - clearTimeout и clearInterval и внимательно смотреть на что ссылаются переменную в функции обратного вызова. Так же стоит отчищать наблюдатели и слушатели событий сразу после их выполнения.

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

Ссылки и копирования

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

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

2022-06-08 19:40:11 Channel photo updated Открыть/Комментировать

2022-06-08 19:22:46 Утечка памяти в js (часть 1)

Перед тем какой перейти непосредственно к утечкам памяти нужно держать в голове немного теории.

Память в javascript делится на две области - стек и куча.
Стек - это область памяти со статическим данным, с фреймами методов/функций и управляется она операционной системой.
Куча же является самой большой областью памяти. Тут хранятся динамические данные и здесь происходит сборка мусора.

А что же делает сборщик мусора? В случае js сборщик мусора периодически запускается и проверяет к какому участку памяти больше нет доступа, чтоб эту область памяти очистить и вернуть в работу.

И вот теперь мы знаем достаточно, чтобы познать и принять перейти к самому понятию утечки памяти.

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

Продолжение следует... Открыть/Комментировать

2022-06-05 09:28:58 Что было на этой неделе

Нашли замену contextmenu в safari

Удобно хранили данные

Думали и пользователе Открыть/Комментировать

2022-06-04 10:34:50 Модель rail

И не нет, это не про ruby on Rails. Это модель оптимизации производительности интерфейса ориентированная на пользователя.

Строится на модель на 4 аспектах, которые следуют из расшифровки аббревиатуры - response, animation, idle (ожидание) и load.
Для каждой ситуации пользователь ждёт разного проведения и нам, разработчикам, надо эти ожидания оправдывать.

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

По мимо красивых слов о том, что нужно делать эта модель даёт на советы как этого достичь:

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

Говорить о том, почему быстрые и плавные сайты лучше медленных, думаю, смысла нет :) Открыть/Комментировать

2022-06-03 21:41:14 Channel name was changed to «Veras IT» Открыть/Комментировать

2022-06-02 21:31:47 S3 контейнер

В этом посте я немного зайду на тёмную сторону веб разработки, а именно - backend. Что же такое s3 контейнеры и с чем их едят?

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

И вот путём гуглежа я нашёл данную штуку. Создана она как раз именно для подобных задач, когда нужно хранить какие либо данные (картинки, json, видео, что угодно) и при этом иметь возможность ограничения доступа. Так, например, из моего контейнера по прямой ссылке можно скачать что угодно, а вот загружать и создавать папки могут только пользователи с доступами.

Взаимодействие с контейнерами происходит через aws sdk. В SDK можно создавать контейнеры, удалять, загружать данные и развлекаться как только можно.

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

Однако, реализацию s3 контейнеров можно найти и на русских хостингах. Открыть/Комментировать

2022-05-31 22:33:56 Все могут кроме apple

Недавно для меня стало сюрпризом, что safari не поддерживает контекстное меню, а именно мобильное контекстное меню (когда долго держишь пальчик на элементе)

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

Поскольку контекстное меню на планшете/мобилке представляет из себя долгое нажатие, соответственно его нам и нужно имитировать. Библиотека (состоящая из одного файла) long-press-event - https://www.npmjs.com/package/long-press-event хорошо с этим справляется.

По большому счету это и всё. Тут главное быть внимательным и проверять все сценарии открытия, т.к. какой нибудь drag тоже по сути является долгим нажатием на элемент. Открыть/Комментировать