Роман Гусев Romanen003 ^read-only

Привет, Хабр! Представляю вашему вниманию перевод статьи "Please Stop Using Local Storage" автора Randall Degges.

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

Так получилось, что последние несколько недель очень часто приходилось слышать слова Promise и Deferred от разных людей. Как правило, этими понятиями оперируют уже повидавшие виды разработчики, столкнувшиеся в своей деятельности с определенными задачами.

Как я могу судить, для людей, которые на практике не столкнулись с некоторыми специфическими проблемами, эти 2 понятия являются довольно трудными для понимания. И не потому, что понятия Promise и Deferred являются с чем-то сложным, а потому, что довольно непросто сходу выдумать подходящую задачу, чтобы попробовать Deferred objects (в JQuery и не только) в действии.

Да, вероятно для тех, кто знаком с этим вопросом он покажется пустяковым и не стоящим и выеденного яйца. Кроме того, вопрос уже многократно обсуждался. Однако, я наберусь смелости еще раз его затронуть и вот почему: 1) Мне кажется, что для некоторых читателей этот пост может оказаться интересным. 2) Я пойду от практики, а не от теории. Моя задача — продемонстрировать работу инструмента. Теорию и другие варианты применения при необходимости вы найдете в ссылках к посту.

Ниже я попробую показать вам что Promise и Deferred это очень и очень просто. Кроме того, для объяснения этой темы, мне придётся затронуть еще несколько интересных моментов JavaScript.

Всем доброго времени суток!

Началось всё с того, что в качестве тестового задания на собеседованиях, я начал просить соискателей реализовать предзагрузчик картинок на JS. Помимо самой предзагрузки, скрипт должен был уметь подставлять fallback-картинку, если нужная картинка не могла быть загружена. Обязательным условием было — использование ES6 Promise.
Затем я подумал: «А почему бы самому не реализовать такой предзагрузчик и не выложить в общее пользование? Да это же еще и отличный повод написать статью на Хабр!».
Собственно, под катом описание логики работы такого предзагрузчика + ссылка на сам предзагрузчик.

JavaScript — относительно простой язык в изучении. Однако, ошибок в нем допускается более чем достаточно. Вы уверены, что не допускаете их? Сегодня мы рассмотрим 11 самых распространенных ошибок.

Ошибка 1 — Использование глобальных переменных

Если вы только знакомитесь с JavaScript, вы, вероятно, думаете, что это отлично, когда все переменные — глобальные. На самом деле, вы можете не знать всех тонкостей этого инструмента. Глобальные переменные — переменные, которые доступны из любого участка кода, даже если они загружены в разные .js-файлы. Звучит заманчиво, не правда ли? Любая переменная всегда доступна для изменения.

На самом деле, нет.

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

var total = 0,    // конечные счет
    tax   = 0.05; // 5%

Теперь, допустим, вы используете код для отображения твитов на странице, или сделали мини-галерею ваших продуктов. И там может содержаться код вроде этого:

var total = 15; // кол-во твитов из twitter

Или,

var tax = function () { /* ... */ }; // Стартер для анимации

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

Зародившись как скриптовый язык в помощь веб-разработчикам, с дальнейшим развитием JavaScript стал мощным инструментом разработки клиентской части, обеспечивающий удобство и интерактивность страницы прямо в браузере у пользователя.

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

Думаю, что большинство программистов, писавших код на JavaScript больше пары дней, сталкивались с этими особенностями. Цель данного топика не открыть что-то новое, а попытаться описать эти особенности «на пальцах» и «недостатки» сделать «преимуществами».

В данном топике будут рассматриваться:

1. Замыкания
2. Прототипирование
3. Контекст выполнения

На данный момент, по данным Can I Use, 84% браузеров поддерживает Grid Layout. С каждым месяцем это число растет. А ведь буквально недавно этот модуль находился за флагом. Поэтому если Вы еще не знакомы с теми возможностями, которые он предоставляет, то самое время это исправить.

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

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