книги хакеры / журнал хакер / 195_Optimized

Визуализируй всё

HTML выглядит следующим образом:

arcs.append('path')

// Цвет заливки определяется функцией, заданной

выше

.attr('fill', function(d, i)

{ return color(i); } )

//Рисование контура SVG path по действиям, задаваемым функцией arc

//with the arc drawing function

.attr('d', arc)

;

Внутри каждого элемента <g> добавляется элемент <path>, с помощью которого можно определять контур сложных фигур. Его атрибут 'fill' нам уже знаком, а с помощью атрибута 'd' задается список операций, описывающий сам контур.

Добавим текст; для его размещения в визуальном центре дуги используется функция arc.centroid(), возвращающая пару координат (x,y).

arcs.append('text')

.attr('transform', function(d) { return

'translate(' + arc.centroid(d) + ')'; })

//Выравнивание текста по центру

.style('text-anchor', 'middle')

//Значение из исходного массива

.text(function(d) { return d.data; })

;

Так как в качестве данных при отрисовке мы используем не исходный массив, а компоновку d3.layout.pie, сформированную на его основе, для того чтобы получить значение из исходного массива (которое и должно быть выведено в виде текста), нужно обратиться к свойству data текущего элемента данных, которое и вернет значение из исходного массива.

угол — вверх)

dy = -ARC_SEL_SHIFT*Math.cos( a );

return 'translate(' + dx + ','+dy+')';

})

;

})

.on('mouseleave', function(d) {

d3.select(this)

Анимация и обработка событий

Для добавления анимации при наведении мыши определим для выборки arcs обработчики mousenter и mousexit и вспомним немного тригонометрии, чтобы элемент, на который указывает мышь, выдвигался из диаграммы от центра по радиусу:

arcs

.on('mouseenter', function(d) {

d3.select(this) // Выберем элемент,

на который наведена мышь

.transition()

.duration(ANIM_DELAY_2)

// Возвращаем в начальную позицию

.attr('transform', function(d) {

return 'translate(0,0)';

})

;

})

;

КРУТЫХФИЧ

WINDOWS 10

111. СРЕДСТВА ИСПОЛЬЗОВАНИЯ ВЕБ-ЯЗЫКОВ ДЛЯ РАЗРАБОТКИ МОБИЛЬНЫХ И WINDOWSПРИЛОЖЕНИЙ

В числе дополнительно устанавливаемых компонентов Visual Studio 2015 Preview (выбирается на второй стадии инсталляции) есть Apache Cordova — инфраструктура для создания кросс-платформенных мобильных приложений, использующих HTML5 и JavaScript. Cordova представляет собой «контейнер» для веб-приложения, позволяющий последнему использовать системные API конкретной операционной системы, в которой он выполняется. Другими словами, Cordova предоставляет интерфейс для управления конкретной операционной системой из языка JavaScript. Это делает приложение кросс-платформенным: код на JavaScript, выполняющий полезную нагрузку, один, но в каждой системе для него используется своя инфраструктура. Такие условия прекрасно подошли для множества разных мобильных операционных систем, в том числе Windows Phone, iOS, Android, Bada, Tizen, BlackBerry, Symbian. Таким образом, Cordova для каждой платформы создает исключительный (предназначенный для конкретной операционной среды) исполняемый модуль, например для Windows Phone это архив XAP. Исполнение веб-контента из такого архива осуществляется встроенным в определенную систему веб-браузером. Как было упомянуто, Visual Studio 2015 поддерживает данную технологию из коробки, при условии установки соответствующего модуля. Visual Studio 2015 Preview послужит разработчикам при написании кода на JavaScript, тут имеются и соответствующий IntelliSense, проводник DOM, для отладки JavaScript-кода можно устанавливать точки останова, просматривать значения переменных и так далее.

1000. ASP.NET 5

Отличный сюрприз для вебразработчиков — новая версия ASP. NET! По словам Microsoft, он был перепроектирован и переделан с нуля,

содержит обновления для SignalR и WebAPI. Теперь он способен выполняться во всех распространенных операционных системах: Windows, Linux, Mac OS X. Из-за того что каждая последующая версия .NET Framework несет за собой наследие предыдущей, в новой версии стек технологии ASP.NET был избавлен от старого мусора, поэтому на данный момент это самая подходящая для построения и развертывания веб-приложений технология. Кроме того, в него более тесно интегрированы менеджер пакетов Bower и система сборки Grunt. ASP.NET 5 позволяет размещать исполняемый контент на сервере IIS, а также в режиме self-hosting. Одна из главных достопримечательностей новой версии — это новый оптимизиро-

ванный конвейер HTTP-запросов. Он обладает большей пропускной способностью по сравнению с предыдущей версией. Изначально проекты ASP.NET 5 ориентированы на использование в облаке. Этому способствует в том числе новая система конфигурации, заменившая собой файл Web.config и позволяющая считывать конфигурационные данные из указанных источников, которыми могут быть JSON- и XML-файлы. ASP.NET 5 прекрасно поддерживает старые приложения. Таким образом, приложения, которые были разработаны для предыдущих версий ASP.NET, MVC, WebAPI, Web Pages, будут так же хорошо работать в новых версиях всех перечисленных продуктов. Мне определенно нравится уверенный шаг Microsoft в сторону открытых исходников, это подкрепляет доверие к корпорации. В данном контексте это касается открытия исходников проектов .NET Framework и ASP.NET. Теперь они хостятся на GitHub. И каждый разработчик может следить за развитием продуктов и принять в нем непосредственное участие.

1010.

ОТЛАДКА И ПРОИЗВОДИТЕЛЬНОСТЬ

Важность «точки останова» для отладки трудно переоценить, поэтому в новой версии Visual Studio разработчики наделили их дополнительными сведениями, которые в процессе дебаггинга может получить программист.

Работая в Visual Studio 2015, программист может, не покидая отладчик, выявить узкие места в своем приложении. Эти советы отображаются прямо в отладчике, они содержат длительность выполнения методов. Механизм cоветов по производительности без вызова профилировщика получил имя

PerfTips.

Кроме того, как мы обсуждали в прошлом номере (статья «Вычисляем на GPU»), в Visual Studio 2015 появились новые средства для сбора и анализа данных о выполнении вычислений на GPU в программах, использующих Microsoft AMP, и играх под DirectX.

1001.ПОЛЬЗОВАТЕЛЬСКИЙ ИНТЕРФЕЙС

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

Обновленный Blend

ЗАКЛЮЧЕНИЕ

Мы очень поверхностно посмотрели самые яркие, выдающиеся изменения и нововведения, содержащиеся в новой экосистеме от Microsoft и предназначенные для разработчика.

Многие инструменты еще пока сырые и, по всей вероятности, будут дорабатываться к финальной версии, которую мы ждем осе-

нью. Например, мне совсем не нравится нынешнее состояние интеграции Xamarin. Тем не менее очевидно, что Microsoft проделала колоссальную работу, чтобы повысить производительность каждого разработчика и улучшить качество создаваемых продуктов. Будем надеяться, что мы еще раскроем те темы, которых в этой статье только коснулись.

Кодинг

Мы нанимаем человека, основная обязанность которого — писать код. Конечно, надо видеть, как он это делает. Соискателю предлагается показать любой готовый проект или выполненное тестовое задание для какой-нибудь организации (с постановкой задачи от заказчика). Если показать нечего, то просим выполнить тестовое задание, которое отправляем по имейлу. Когда программист присылает ответ, ведущие разработчики DZ смотрят на код, на правильность выполнения, аккуратность и, как говорится, на красоту архитектуры. Если выполнение нравится, то приглашаем соискателя на собеседование с HRспециалистами, которые смотрят, насколько человек подойдет к сложившейся команде. Мы выбираем людей не только по знаниям, но и по человеческим качествам, для нас очень важны сохранение хорошего климата, комфортная работа с коллегами. На собеседовании стараемся определить, насколько этот человек «наш». Если у него нет всех необходимых навыков, но видно, что он может научиться, есть потенциал, то рады будем с ним сотрудничать.

Программист, который хорошо написал тестовое задание, после беседы с HR-специалистом проходит техническое собеседование с ведущими разработчиками. Офисы

DZ находятся в разных городах, поэтому второе собеседование может проводиться по скайпу. Например, мобильные разработчики у нас в Санкт-Петербурге и Казани, а Javaразработчики — в Казани и Ульяновске.

В DZ Systems есть типовые наборы задач и вопросов для технического собеседования, рассчитанного на один час. Такие задачи мы и предлагаем для решения читателям «Хакера». Победители получат возможность бесплатно пройти новый игровой квест от наших друзей из компании «Клаустрофобия» — ограбление банка (questbank.ru). В этом квесте ты получишь возможность на час попасть в банковское хранилище и, еще раз проявив логические способности, вынести оттуда ценную реликвию.

ЗАДАЧА 1

При использовании очевидного представления данных для сохранения даты требуется 8 байт (ДДММГГГГ), а имя человека занимает примерно 25 байт (14 на фамилию, 10 на имя и 1 на первую букву отчества). Насколько вы сможете уменьшить эти числа, если перед вами стоит задача экономии памяти?

ЗАДАЧА 1. КОЛИЧЕСТВО РАЗБИЕНИЙ НА K СЛАГАЕМЫХ

Задача является стандартным примером задачи на динамическое программирование. Обозначим интересующее нас количество разбиений через F(n, k). Часть из разбиений содержит единицу в качестве слагаемого. Все такие разбиения можно получить из разбиений числа n – 1 на k – 1 слагаемое добавлением единицы в качестве k-го слагаемого. Те разбиения, которые единицу не содержат, получаются из разбиения числа n – k на k слагаемых прибавлением единицы к каждому из k слагаемых. Таким образом, получается рекуррентная формула: F(n, k) = F(n – 1, k – 1) + F(n – k, k). Объединяя ее с граничными условиями F(n, k) = 1 при n = k либо k = 1 и F(n, k) = 0 при n < k, получаем решение задачи. Пример кода на Java:

public class PartitionNumberCounter {

private int[][] table;

private PartitionNumberCounter(int number,

int itemsCount) {

this.table = new int[number][itemsCount];

}

private int countPartitions(int number,

int itemsCount) {

if (number == itemsCount || itemsCount == 1) {

return 1;

}else if (itemsCount > number) { return 0;

}

if (table[number - 1][itemsCount - 1] == 0) {

table[number - 1][itemsCount - 1] =

countPartitions(number - 1, itemsCount - 1)

+ countPartitions(number - itemsCount,

itemsCount);

}

return table[number - 1][itemsCount - 1];

}

public static int countNumberOfPartitions(int

number, int itemsCount) {

return new PartitionNumberCounter(number,

itemsCount).countPartitions(number, itemsCount);

}}

ЗАДАЧА 2. МЕДИАНА

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

Для получения медианы массива A = [2, 1, 5, 0, 10] отсортируем массив, получим A_sorted = [0, 1, 2, 5, 10]. Медианой массива является третий элемент массива, то есть 2.

Для нахождения медианы массива с четным числом элементов существуют различные соглашения. Для решения задачи примем следующее соглашение: медианой массива A с четным числом элементов 2N является (A_sorted[N] + + A_sorted[N + 1]) / 2.

Самым популярным и при этом самым неоптимальным способом решения этой задачи является конкатенация массивов, сортировка результирующего массива и получение среднего от n и n + 1 элементов. Такой способ решения имеет алгоритмическую сложность O(n log n). Второй по популярности метод решения этой задачи — использование

IT-КОМПАНИИ, ШЛИТЕНАМСВОИЗАДАЧКИ!

Миссия этой мини-рубрики — образовательная, поэтому мы бесплатно публикуем качественные задачки, которые различные компании предлагают соискателям. Вы шлете задачки на lozovsky@glc.ru — мы их публикуем. Никаких актов, договоров, экспертиз и отчетностей. Читателям — задачки, решателям — подарки, вам — респект от нашей многосоттысячной аудитории, пиарщикам — строчки отчетности по публикациям в топовом компьютерном журнале.

ЧИТАТЕЛИ, ШЛИТЕ ВАШИ ОТВЕТЫ!

Правильные ответы принимает Анна Новомлинская (press@ dz.ru). Она же распределяет призы — билеты на офлайнквест. Не теряйся!