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

Поэтому в этой статья я решил собрать топ-10 советов о том, как же можно увеличить скорость загрузки веб-странички и сайта в целом. Статья не претендует на гениальность и рассчитана на новичков.

10 советов о том, как увеличить скорость загрузки страницы

#web #frontend #backend

​​mailgo — небольшая JavaScript библиотека, которая меняет все mailto: ссылки на красивые ссылки с попаутами, предлагающие выбор почтового клиента. Кнопкой копирования email адреса и защитой от спама.

Демо | GitHub

#js #mail

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

http://bit.ly/2WQcaAY

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

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

Технологические тренды веб-разработки 2019

#web #article #trends

​​ngxCharts — это библиотека чартов для Angular 2+. Простая библиотека с отличной документацией и множеством примеров. Поддерживает большое количество разных типов чартов.

Демо | GitHub

#charts #angular

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

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

10 полезных советов по реализации Pixel Perfect дизайна в Frontend разработке

#frontend #design #article

​​Medium Zoom — классная JavaScript библиотека, которая добавляет на сайт возможность создания зума для картинок как на сайте Medium'a. Библиотека обладает рядом преимуществ: управление зумом мышкой или клавиатурой, SD качество в HD при зуме, анимация в 60fps и много еще.

Демо | GitHub

#js #zoom #img

Как создать разметку, в которой позиция элемента по вертикали зависит от высоты элемента, расположенного над ним, как на Pinterest? Ответ в статье.

Галерея картинок в стиле Pinterest

#css #tips #article

​​Cash — это абсурдно маленькая альтернатива jQuery для современных браузеров, которая цепочки управления элементами DOM в стиле jQuery. Библиотека не нацелена на полное покрытие всех методов jQuery, а наоборот фокусируется только на самых часто используемых методах.

GitHub

#js #jquery

​​Ola — это отличные JavaScript чарты, которые позволяют интерполировать цифры и наборы данных. Предлагает много типов чартов, которые могут динамически обновляться и имеют плавную анимацию.

Демо | GitHub

#js #charts

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

Буллиты для списков

#fontent #css #tips

​​React95 — это коллекция из более 30 React компонентов в стиле Windows 95. Включая календари, кнопки, иконки, инпуты и много другого ретро UI.

Демо | GitHub

#react #components

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

GitHub

#js #server

​​Ink — это React фреймворк, который позволяет создавать приложения для командной строки.

GitHub

#js #react #console

Области видимости в JavaScript всегда были непростой темой, особенно в сравнении с более строго организованными языками, такими, как C и Java. В ECMAScript 6 появились некоторые новые возможности, которые позволяют разработчикам лучше контролировать области видимости переменных.

Когда использовать ключевые слова let и const? Как они себя ведут? В каких ситуациях всё ещё актуально ключевое слово var?

Var, let или const? Проблемы областей видимости переменных

#js #article

​​Hat.sh — это JavaScript библиотека, которая предоставляет возможность безопасного шифрования файлов используя WebCrypto API. Библиотека обладает рядом преимуществ: она быстрая, безопасная и serverless. Вы можете быстро зашифровать и расшифровать файлы без проблем.

Демо | GitHub

#js #security #crypto

​​Monaco Editor — это движок, на котором основан популярный VS Code. Он позволяет использовать все функции редактора кода прямо в браузере. Поддержка синтаксиса для разных языков программирования, несколько курсоров, горячие клавиши, исправление кода и многое другое. Это open-source движок, так что вы можете использовать его в своих проектах.

Демо | GitHub

#engine #vscode #js

Во многих фронтенд-фреймворках, написанных на JavaScript (например, в Angular, React и Vue) имеются собственные системы реактивности. Понимание особенностей работы этих систем пригодится любому разработчику, поможет ему более эффективно использовать современные JS-фреймворки.

Реактивность в JavaScript

#js #article

​​Pixelmatch — это небольшая и очень быстрая JavaScript библиотека для точного сравнения двух фотографий "по пикселям". Работает в браузере и на Node. Не требует зависимостей.

Демо | GitHub

#js #node