Category Archives: Programming

shake.js — jQuery-плагин для определения, что телефон трясут

https://github.com/alexgibson/shake.js

SEO для одностраничных приложений

http://mono.software/2016/02/18/SEO-for-javascript-applications/ Разжёвывают старую идею, что нужно урлы делать с «хешбэнгами», т.е. http://www.site.com/#!/some/page. При этом при запросе по урлу http://www.site/?_escaped_fragment_=/some/page нужно отдать сгенерированный контент.

Сайт, посвящённый style guides для фронтендеров

http://styleguides.io/

Нормальный видеоплеер

http://uppod.ru/ JS API — http://uppod.ru/samples/js/test.html

Как проверить стиль элемента в javascript

Есть простой способ, но не очень корректный:

var el = document.createElement('div');
el.style[styleName] = "10px";
document.body.appendChild(el);
console.log(el.style[styleName]);

var el = document.createElement('div');

el.style[styleName] = "10px";

document.body.appendChild(el);

console.log(el.style[styleName]);

Есть более сложный способ, но корректный для ошибочных стилей:

var el = document.createElement('div');
el.style[styleName] = "10px";
document.body.appendChild(el);
console.log(window.getComputedStyle(el)[styleName]);

var el = document.createElement('div');

el.style[styleName] = "10px";

document.body.appendChild(el);

console.log(window.getComputedStyle(el)[styleName]);

Пример: JS Bin on jsbin.com

Как найти все обработчики на элементе в Google Chrome

Захотелось мне узнать обработчики всех событий в Google Chrome. Оказалось, это легко можно сделать, достаточно в консоли написать getEventListeners(document); https://developer.chrome.com/devtools/docs/commandline-api#geteventlistenersobject

Советы по производительности AngularJS

Это перепечатка статьи Релиз Angular.js 2.0 приближается, а проблемы с производительностью первой версии все еще остаются. Эта статья посвящена оптимизации Angular.js приложений и будет полезна как начинающим, так и тем, кто уже использует этот фреймворк, но еще не сталкивался с проблемами его производительности. Немного простой теории Как известно, Angular.js это декларативный фронт-енд фреймворк, предоставляющий удобный …

Tape: тестовый фреймворк без б

https://github.com/substack/tape Здесь рассказывают, чем он лучше Моки, Жасмина и прочих: https://medium.com/javascript-scene/why-i-use-tape-instead-of-mocha-so-should-you-6aa105d8eaf4 Если коротко — прост в настройке, нет всяких хитрых сложных мокеров, вместо before/afterEach православные setUp/tearDown.

Ошибки при разработке AngularJS-приложения

Старайся содержать контроллеры максимально простыми. Весь повторяющийся код выноси в сервисы. Разделяй объявление методов контроллера и тела функций

$scope.click = click;
$scope.$watch('item', watchItem);

function click(e, item)
{
  ...
}
function watchItem(item)
{
  ...
}

$scope.click = click;

$scope.$watch('item', watchItem);

function click(e, item)

{

...

}

function watchItem(item)

{

...

}

Не полагайся на наследование $scope-ов контроллеров. Этот ад ты потом не сможешь поддерживать. Достаточно будет при редизайне перенести блоки или выделить кусок контроллера в сервис. А представить нормальное тестирование этого я даже не берусь. UPD: Лучше …

Почему React хуже AngularJS

Моё мнение во многом совпадает с мнением автора статьи http://habrahabr.ru/post/249107/.