Pull to refresh

Символ подчеркивания в именах сайтов и cookie

Website development *
Столкнулся сегодня с интересной проблемой, которая нагло выжрала 1.5 часа драгоценного времени. Надеюсь поможет другим избежать той же участи. :-)
Читать дальше →
Total votes 81: ↑62 and ↓19 +43
Views 18K
Comments 71

Underscore.js — библиотека, которая так хороша, что должна быть вне закона

JavaScript *
Каждый, кому приходилось писать объемные куски осмысленного кода на javascript, рано или поздно понимал, что ему многого не хватает в этом языке или просто неудобны некоторые врожденные конструкции. Для сглаживания шероховатостей применяются jQuery, Prototype, MooTools etc. Кто-то уже мало представляет себе, как можно кодить без них. Сегодня я расскажу о еще одной маааленькой библиотечке, которая делает мир javascript-программиста еще прекраснее. Речь пойдет о Underscore.js
Go ahead, make my day
Total votes 177: ↑163 and ↓14 +149
Views 48K
Comments 51

camelCase против under_score

Perfect code *
Translation
В настоящее время существует много стандартов наименования переменных, но два из них являются наиболее популярными среди программистов: это camel case («Верблюжья» нотация) и underscore (именование переменных с использованием символа нижнего подчеркивания в качестве разделителя). Кто-то может возразить, что существуют и другие популярные стандарты, но в рамках данной статьи мы сравним эти два, и узнаем у программистов — какого стандарта придерживаются они. Конечно, некоторые программисты связаны рамками стандартов кодирования языка или фреймворка, который они используют, но мы постараемся сделать независимое сравнение.
Читать дальше →
Total votes 70: ↑36 and ↓34 +2
Views 65K
Comments 165

Написание сложных интерфейсов с Backbone.js

JavaScript *
image

Backbone.js это каркас для создания RIA JavaScript приложений, его автором является Jeremy Ashkenas, создатель CoffeeScript, Backbone является частью компании Document Cloud ей же «принадлежит» Underscrore.js. Backbone — очень легкая библиотека, помогающая вам создавать интерфейсы. Она может работать с любыми библиотеками, к которым вы привыкли.
Backbone это набор классов, размером менее 4Кб, которые формируют структуру вашего кода и помогают создавать качественные MVC веб-приложения.
Backbone формирует структуру тяжелых JavaScript приложений, внесением моделей с key-value подобным хранилищем и своими событиями, коллекций с богатыми API, видов (ориг. views) с декларативной обработкой событий и соединяет все это в в одно приложение, поддерживающее RESTful JSON интерфейс.

Backbone не может работать без Underscore.js. Для поддержки REST API и работы с DOM элементами в Backbone.View настоятельно рекомендуется подключить json2.js и jQuery-подобную библиотеку: jQuery или Zepto

В статье будет рассмотрена структура Backbone.js, будет поэтапно создано простое Todo приложение.
Читать дальше →
Total votes 108: ↑103 and ↓5 +98
Views 98K
Comments 47

Пишем одностраничный клиент на javascript

Website development *
Данная статья является вольным переводом. Оригинал тут.

Введение


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

Предлагаю ознакомиться с решением на базе backbone.js, underscore.js и jQuery, которое поможет решить эту проблему.

Постановка задачи


Каким бы мы хотели видеть наше приложение? Вот основные моменты, которые мне кажутся важными:
  1. Должен быть удобный способ описать модели нашей предметной области.
  2. Любые изменения в модели должны немедленно отражаться в пользовательском интерфейсе, если модель в нем представлена каким-либо образом.
  3. Понятная и легко-поддерживаемая структуризация кода в стиле MVC.


Попробуем решить эти задачи на примере простого приложения «Каталог фильмов».
Поехали!
Total votes 70: ↑64 and ↓6 +58
Views 47K
Comments 51

Подчеркивание в имени хабра_пользователя

Habr


Обращаю внимание тех хабра_хабрапользователей, которые используют подчеркивание (underscore) в своих именах (никах). В отношении всех нас была изменена политика партии администрации. Заметил я это нынешней осенью, скорее всего это связано с нашумевшим осенним обновлением. Я думал, что об этом изменении еще дополнительно сообщат хабрасообществу, но до сих пор тишина…

Расскажу, какие были изменения на примере ссылок на профиль. Ранее на хабре во всех ссылках на профили пользователей, которые использовали подчеркивание в имени, "_" заменялилось на дефис. Теперь же это убрали, т.е. подчеркивание (underscore) на дефис не заменяется!

Читать дальше →
Total votes 67: ↑49 and ↓18 +31
Views 721
Comments 50

The Node Toolbox

Node.JS *
Обнаружив трёхдневной давности правку в вики Node, я жмякнул по приведённой там гиперссылке и попал на сайт-каталог «The Node Toolbox», довольно полезный. Как я понял тотчас же, целью этого сайта является распределение по категориям (или по тегам) всех тех пакетов с джаваскриптами для Node, которые содержатся в каталоге пакетного менеджера npm. Таким образом, сайт этот может быть ценною отправною точкою для поиска пакетов для Node по их предназначению. (В мире открытого кода это средство, как и другие до него, позволяет человеку внимательному не переизобрести ненароком чей-нибудь велосипед.)

Наверху сайта «The Node Toolbox» видна «горячая десятка» наиболее свежих пакетов и десятка наиболее используемых пакетов (по числу зависимостей других пакетов от них) — в общем-то это средство менее полезно и инновационно, чем список категорий, потому что эти рейтинги и без того видны на search.npmjs.org (притом там в рейтингах видать по пятнадцать пакетов, а у «The Node Toolbox» всего лишь по десять).

Более или менее пристальное вглядывание в эти рейтинги на протяжении нескольких последних месяцев привело меня ко впечатлению (быть может, и ошибочному: архивов-то рейтингов я не веду, а полагаюсь на память) о постепенном росте популярности пакета async, сейчас вошедшего ужé в десятку наиболее используемых. Он полезен тем, что содержит два десятка функций, серьёзно упрощающих объединение вызовов асинхронных функций, составление из них более крупных фрагментов алгоритмов. Не могу не отметить, что наблюдаемая популярность вполне заслужена пакетом async. Есть основания думать о части функций пакета async (притом о заметно большой части их) как о своего рода асинхронном аналоге соответствующих функций underscore, используемых при пакетной обработке коллекций (то есть массивов и объектов) — а ведь тот же рейтинг называет пакет underscore наиболее используемым в других пакетах для Node. Логично, что популярен и асинхронный аналог его.

Читать дальше →
Total votes 31: ↑24 and ↓7 +17
Views 1.6K
Comments 5

Альтернативный взгляд на плагин для маски ввода чисел и не только в input и textarea

jQuery *
Sandbox
Вдогонку к опубликованной раннее статье Плагин для маски ввода чисел в input, хотел бы поделиться своим взглядом на решение данной проблемы.

Подробности под Хаброкатом.

Читать дальше →
Total votes 13: ↑11 and ↓2 +9
Views 2.3K
Comments 7

Написание сервиса японских кросвордов на gae, backbone, underscore, require и еще с помощью черт знает чего

Google App Engine *
Sandbox

Вступление


Многие знают про инфраструктуру от google под названием gae, некоторые считают её слишком проприетарной, другие слишком дорогой. Да она не дешевая, и мы попробуем написать оптимальное приложение для gae, которое жрало бы очень мало ресурсов и в идеале не выходило из бесплатных квот даже при хабраэффекте. Опишу мои ошибки, удачные технологические решения при написания сервиса японских кроссвордов. Фишка сайта в том что он позволяет создавать свои кроссворды и из обычной картинки тоже и делиться ими с друзьями.
Для построения сайта используется след. технологии:
backbone.js — фреймворк для обработки запросов на javascript'е. C его помощью будем надеяться, что уложимся в бесплатные квоты, так как весь код выполняется на клиенте, с сервера запрашиваются только данные о кроссвордах в json формате.
require.js — библиотека для дозагрузки любых ресурсом(js, html), можно указать код, который выполнится после загрузки всех ресурсов. Идеальна если у вас есть на сайте javascript и он используется в 1% случаев, и вы не хотите включать js-файл в index.html, то она вам подойдет.
undescore.js — всякие плюшки для слежения за изменением всего объекта или за конкретным его свойством. Очень большая и крутая библиотека, но я использую её как шаблонизатор.
bootstrap — чтобы не заморачиться с дизайном.
less — не ну, а почему б не использовать? (Потому что мы можем)
Ну и конечно же gae — на чем все это будет крутиться.

Читать дальше →
Total votes 39: ↑37 and ↓2 +35
Views 3.7K
Comments 19

Обработка неопределённых глобальных переменных располагается далёко от здравого смысла! Но её можно превозмочь…

Website development *JavaScript *
Здравый смысл веборазработчика подсказывает, что во браузерном джаваскрипте глобальные переменные являются свойствами объекта window так что window.чегоНибудь и просто чегоНибудь должны быть синонимами и вести себя одинаково (если, конечно, мы не находимся в какой-нибудь такой функции, где переменную чегоНибудь переопределили локально).

Здравый смысл веборазработчика также ещё подсказывает, что неопределённая переменная должна иметь значение undefined так что чегоНибудь и undefined должны быть синонимами и вести себя одинаково, когда переменную чегоНибудь не определяли в джаваскрипте (и если, конечно, никакой чудила не дерзнул переопределить undefined).

Но если вы собираетесь программировать для Opera 11 (будь то начальная версия Opera 11.01 или новёхонькая Opera 11.61), то будьте готовы отречься от здравого смысла в обоих сих случаях! (Не только в Opera, но и в других браузерах и средах — но об этом чуть позже.)

Чтобы нагляднейше убедиться в этом, воспользуемся библиотекою Underscore.js, в которой как раз имеется удобная функция тестирования неопределённых переменных — это функция _.isUndefined(), в исходном коде определённая самоочевидным способом:

// Is a given variable undefined?
_.isUndefined = function(obj) {
   return obj === void 0;
};

Читать дальше →
Total votes 33: ↑15 and ↓18 -3
Views 2.2K
Comments 30

Клонирование объектов в Node.js: Быстрее, глубже, нежнее!

«Alawar Entertainment» corporate blog Node.JS *
Не так давно, прочитав статью idoroshenko «Почему eval — это не всегда плохо», я задумался, можно ли использовать подход с генерацией тела функции для клонирования объектов. Даже написал небольшую библиотеку для этого. Бенчмарки давали невероятные результаты, но применимость этого подхода ограничивалась лишь множественным клонированием одинаковых объектов.

Поэтому и у меня возник вопрос: неужели в v8 нет другой возможности избежать расходов, связанных со множественным пересозданием скрытых классов? Ведь это составляет основные траты ресурсов, когда мы клонируем объекты. Как оказалось, такая возможность действительно есть: в самом v8 у объектов существует метод v8::Object::Clone. Этот метод клонирует объекты в широком смысле этого слова, то есть собственно объекты, а также массивы, даты, регулярные выражения, функции и т.д., при этом сохраняя все их свойства, в том числе нестандартные (например, именованные свойства массивов) и даже скрытые.

Была только одна маленькая проблема. Этот метод использовался только в недрах node.js, и не был открыт наружу, для javascript'а.
Читать дальше →
Total votes 47: ↑45 and ↓2 +43
Views 14K
Comments 15

Файлы библиотек да будут названы по сокращённым именам объектов, ими определяемых

Website development *JavaScript *
Tutorial
Вот лайфхак: для сокращения имён файлов (а значит — для ускорения их прочтения и узнавания) можно называть файлы с джаваскриптовыми библиотеками в соответствии с сокращённым именем того основного объекта, который той или иной библиотекою определяется.

Так, например, файл jQuery можно назвать «$.js».

Так, например, файл Underscore.js можно назвать «_.js».

Так, например, файл Underscore.string можно назвать «_.str.js».

Ну и так далее.
Total votes 60: ↑15 and ↓45 -30
Views 690
Comments 26

Переводим Chrome extension на manifest_version 2

Google Chrome
Владельцам расширений (а также приложений) для Хрома уже пора бы задуматься над поддержкой второй версии манифеста.
Если кто не в курсе, то не так давно были объявлены новые изменения и нововведения в разработку расширений для браузера.
Далее будет выборочный перевод двух страниц и мой способ использования шаблонизатора изнутри песочницы.
Читать дальше →
Total votes 17: ↑14 and ↓3 +11
Views 22K
Comments 5

JavaScript — это Бейсик сего дня! (В хорошем смысле.)

JavaScript *TypeScript *
С каждым днём во мне крепнет осознание того, что JavaScript стремится играть ту же роль (занять ту же нишу), которая была свойственна Бейсику лет тридцать или даже пятнадцать тому назад.

Иными словами, JavaScript становится простым и распространённым языком, далеко переросшим своё первоначальное предназначение, и на нём теперь можно сочинить почти какое угодно приложение (и клиентское, и серверное, и консольное… и даже с GUI, как я недавно убедился).

Создаются целые операционные системы (Firefox OS, Google Chrome OS, Open webOS), для которых JavaScript является не менее «родным», чем Си для UNIX в своё время.

Появляются языки, транслируемые в JavaScript (можно вспомнить CoffeeScript, Dart, новорождённый TypeScript, и так далее).

Заметив это, уместно тотчас же порадоваться тому, что к джаваскрипту предъявляют, по крайней мере, меньше серьёзных претензий, чем некогда к Бейсику, который по справедливости невзлюбили за его GOTO и поощрение «макаронного кода». Притом джаваскрипт гораздо лучше переносится и с платформы на платформу, и из браузера во браузер.

Кроме того, многие существующие проблемы джаваскрипта не имеют особенного значения, потому что устраняются широко распространёнными средствами с открытым исходным кодом. Так, нестрогость синтаксиса устраняется строгою проверкою исходного кода (JSLint, например). Нехватка средств обработки данных (массивов, объектов) и функций устраняется подключением Underscore, а строки помогает обработать Underscore.string, а даты — moment.js, например. Сложность употребления методов DOM (в которой, впрочем, повинен не язык JavaScript, а браузеры и их разнобой) преодолевается с помощью jQuery. И так далее. Это входит в привычку у программистов.

Читать дальше →
Total votes 82: ↑57 and ↓25 +32
Views 18K
Comments 46

Lo-Dash

«Alawar Entertainment» corporate blog JavaScript *Node.JS *
Translation
Прим. переводчика: underscore.js — одна из самых известных и любимых javascript-библиотек. Но мало кто знает, что есть её более удачный клон. В одном из своих проектов мы без каких-либо проблем перешли на него и теперь решили познакомить с ним других читателей Хабрахабра.

Lo-Dash — это полноценная замена* для Underscore.js. Lo-dash имеет более высокую производительность, избавлен от некоторых багов underscore и даёт некоторые новые возможности.


Читать дальше →
Total votes 41: ↑36 and ↓5 +31
Views 33K
Comments 31

Дросселирование ввода на AngularJS с помощью debounce

JavaScript *Angular *
Translation
Tutorial
Существуют различные сценарии для использования дросселирования (throttling) ввода так, что пересчет значений фильтра будет происходить не каждый раз при изменении значения, а реже. Более подходящий термин — это «устранение дребезга» (debounce), так как в сущности вы ожидаете стабилизации значения на каком-либо постоянном уровне перед вызовом функции, чтобы не вызвать «дребезг» постоянных запросов к серверу. Канонический случай такого рода — это пользователь, вводящий текст в поле ввода для фильтрации списка элементов. Если логика вашего фильтра включает некоторый оверхед (например, фильтрация происходит через REST-ресурс, который выполняет запрос на базе данных бекенда), то вы точно не захотите все время перезапускать и перезагружать результаты запроса в то время, как пользователь пишет текст в поле. Более правильным будет вместо этого подождать, пока он закончит, и уже после этого выполнить запрос один раз.

Простое решение этой проблемы находится тут: jsfiddle.net/nZdgm

Представим, что у вас есть список ($scope.list), который вы публикуете как фильтрованный список ($scope.filteredList) на основе чего-либо содержащего текст из поля $scope.searchText. Ваша форма выглядела бы примерно следующим образом (не обращайте внимание на чекбокс throttle пока что):
Читать дальше →
Total votes 22: ↑18 and ↓4 +14
Views 14K
Comments 16

lodash (underscore) — знай свою стандартную библиотеку

Website development *JavaScript *
image

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

Что же, в последнее время, в своей работе я во всех проектах задействую lodash (кому-то может больше нравиться underscore). Для меня это, фактически, — стандарт. В очередной раз пробегая глазами API, я решил составить для себя шпаргалку в виде: «название функции» — «краткое описание». Так удобно освежать API в памяти. Может кому пригодится.
Читать дальше →
Total votes 76: ↑54 and ↓22 +32
Views 171K
Comments 62

[Перевод] Не стоит бояться функционального программирования

JavaScript *Functional Programming *Data visualization *
Представляю вашему вниманию перевод проскользнувшей недавно в ссылках дайджеста статьи Джонатана Моргана о функциональном программировании на примере JavaScript. Материал рассчитан на начинающих, но тем не менее он достаточно интересен.

Буду признателен за конструктивные замечания и предложения по опечаткам, переводу и/или оформлению. Приятного чтения!
Читать перевод
Total votes 42: ↑39 and ↓3 +36
Views 38K
Comments 20

Autopolyfiller — Precise polyfills

Website development *JavaScript *

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

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

Есть целый ряд способов исправить эту ситуацию:

lodash и underscore


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

_.chain([1, 2, 3, 4])
.map(function (item) {
    return item * item;
})
.filter(function (item) {
    return item < 9;
})
.value();

Читать дальше →
Total votes 45: ↑44 and ↓1 +43
Views 13K
Comments 5

Собеседование на должность JavaScript разработчика

JavaScript *Programming *


Недавно прочитал неплохой пост на тему поиска работы QA и подумал, что похожий пост был бы полезен для JavaScript разработчиков. В конечном счёте, веб движется вперед семимильными шагами, и соискателей на позицию JavaScript программиста хоть отбавляй (разумеется, хороших всегда меньше).
Читать дальше →
Total votes 126: ↑115 and ↓11 +104
Views 285K
Comments 313
1