#js #tips

Управление памятью в JavaScript, утечки памяти и как с ними справляться

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

Читать: https://prglb.ru/4s21z

#vue #book #english

Building Progressive Web Applications with Vue.js: Reliable, Fast, and Engaging Apps with Vue.js

Автор: Carlos Rojas
Год издания: 2020

Скачать книгу

#vue #english

В чём разница между CSS Grid и Flexbox

Если коротко, CSS Grid — для разметки, Flexbox — для компонентов. Если наглядно, то посетите замечательный сайт, где на пальцах объясняются главные отличия:

https://tprg.ru/NXsD

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

#фронтенд #css

ES6 - шаблонные строки

Шаблонные строки заключены в обратные кавычки () .
Они могут содержать подстановки, обозначаемые знаком доллара и фигурными скобками (${выражение}).

Возможности:

1. Многострочность

console.log(`string text line 1
string text line 2`);
// "string text line 1
//  string text line 2"

2. Интерполяция выражений

 a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and not ${2 * a + b}.`);
// "Fifteen is 15 and not 20."

3. Сырые строки

 tag(strings) {
  return strings.raw[0];
}

tag`string text line 1 \\n string text line 2`;
// выводит "string text line 1 \\n string text line 2",
// включая 'n' и два символа '\'

4. Вложенные шаблоны

 classes = `header ${ isLargeScreen() ? '' :
`icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;

Как Vue Composition API заменяет Vue Mixins

https://css-tricks.com/how-the-vue-composition-api-replaces-vue-mixins/

Правильный ответ: Все объявления корректны

Свойство content допускает использование самых разных значений и даже их комбинацию.
Пример: https://codepen.io/mohnatus-the-lessful/pen/MWKvRpy
Документация: https://developer.mozilla.org/ru/docs/Web/CSS/content

Подробный разбор свойства content читайте в статье Вот что я не знал о content.

#css

Добро пожаловать в ад…зависимостей JavaScript

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

https://nuancesprog.ru/p/8559

@nuancesprog #статьи #JavaScript

jest vs jasmine: основные отличия

В чем разница между двумя самыми популярными решениями для тестирования и почему jest один, а карма всегда в связке с жасмином?

Читать: https://prglb.ru/tej1

#testing #jest #jasmine

#laravel #vue #tips

Создание видеочата на Laravel+Vue+Pusher
#english
https://medium.com/@otacorporation0520/create-a-video-chat-application-with-laravel-7-vue-js-based-on-webrtc-58c88a503c17

#vue #tips #english

Паттерн Репозиторий для работы с API-запросами.
Интересный подход.

https://medium.com/canariasjs/vue-api-calls-in-a-smart-way-8d521812c322

#laravel #vuejs #course #english

Бесплатно! Crash Course for Laravel 7 and VueJs Basics

Промо-код только сегодня действует.

https://www.udemy.com/course/crash-course-for-laravel-7-and-vuejs-basics/?couponCode=DIGITAL_OCEAN

ES6 - Symbol

Symbol это уникальный и неизменяемый тип данных.

Свойства символов:
При создании символам можно дать имя.

 Создаём символ id с описанием (именем) "id"
let id = Symbol("id");

Они гарантированно уникальны.

 let id1 = Symbol("id");
 let id2 = Symbol("id");

alert(id1 == id2); // false

Не преобразуются автоматически в строки.

 let id = Symbol("id");
alert(id); // TypeError: Cannot convert a Symbol value to a string

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

let id = Symbol("id");

let user = {
  name: "Вася",
  age: 30,
  [id]: 123 // просто "id: 123" не сработает
};

Игнорируются циклом for…in

 for (let key in user) alert(key); // name, age (свойства с ключом-символом нет среди перечисленных)

#js #tools #russian

Веб-воркеры, сервис-вокеры и ворклеты — в чем сила, брат?

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

https://medium.com/@victorkukshinov/%D0%B2%D0%B5%D0%B1-%D0%B2%D0%BE%D1%80%D0%BA%D0%B5%D1%80%D1%8B-%D1%81%D0%B5%D1%80%D0%B2%D0%B8%D1%81-%D0%B2%D0%BE%D1%80%D0%BA%D0%B5%D1%80%D1%8B-%D0%B8-%D0%B2%D0%BE%D1%80%D0%BA%D0%BB%D0%B5%D1%82%D1%8B-1e2f561312fd

​Аутентификация с использование RESTful API на Vue

Аутентификация пользователя - важная часть веб-приложения. Разбираемся, как реализовать ее в SPA на Vue.

Читать: https://prglb.ru/esn7

#frameworks #vue

​"Умные" анимации с кастомными CSS-свойствами

Создание гибких настраиваемых анимаций на CSS-переменных.

Ссылка: https://prglb.ru/37yhd

#css #animation

React и Redux. Функциональная веб-разработка

Авторы: Бэнкс А., Порселло Е.

Год издания: 2018

Скачать книгу

#react #redux #русский