Задать вопрос
Fesor

Сергей Протько

Full-stack developer (Symfony, Angular)
Ответы пользователя по тегу JavaScript

  • Как правильно реализовать обновление динамических данных в RealTime?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Ну если говорить о правильно...

    1) на сервере крутится демон который собирает всю эту статистику и позволяет отдавать ее по изменениям.
    2) клиенты коннектятся к серверу через websockets/long poling и таким образом получают актуальные данные. То есть не просто "скажи клиентам что бы обновили данные" а посылать сразу данные.
    3) передаваться должны только данные, рендриться пусть все на клиенте. Это решает проблему с сортировкой - ее можно делать и на клиенте.

    Профит.
    Ответ написан
    3 комментария
    3 комментария

  • В чем могут помочь js фреймворки(React, Angular)?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    C MVC фреймворками все понятно, но они меня не интересуют. А что делать с инструментами, нацеленными больше на фронтенд (React, Angular) ?


    Открою вам страшную тайну - MVC фреймворки как раз на фронтэнд и нацелены, а не на бэкэнд.

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

    Angular - полноценный фреймворк, к которому можно подключить тот же React для вьюх. Используют его в основном при реализации Single Page Application-ов.

    Были ли у вас практические задачи, с которыми мог справиться только js фреймворк? Какие?

    Все задачи можно решить на чем угодно. Вопрос в сроках и кривости. Angular позволяет организовать структуру приложения, разделить его на слои, предоставляет ViewModel... все то что писать с нуля маленький ад и скучно. Ну и опять же все можно покрыть тестами и т.д.

    Могут ли быть полезны данные инструменты в совместной работе с Rails, например?

    Если брать ангуляр - я его использую только в контексте SPA. Это может быть не все приложение а только какая-то его часть но все же... А для SPA разницы нет вообще на чем бэкэнд реализован. От бэкэнда нужна только апишка.

    Реакт же можно использовать в принципе для построения view на клиенте. Так что можно и его юзать. Зависит от задачи. Скажем если в задачи входит организация работы жирной формы - то лучше взять knockout.js. А если вам нужно рендрить какие-то данные в реалтайме - можно вооружиться реактом.

    Нужно ли вообще тратить время и искать себе задачи, которые можно решить привычным jQuery, который в большей степени знают все (вопрос дальнейшей поддержки) ?

    Куча народу знает jQuery но не знает JS. И это грусть и печаль. Скорее всего если у вас в задачах стоит реализовать слайдер какой или что-то такое то ни Angular ни React вам не нужны. Ну или в контексте сайтиков тоже не особо есть от них польза (только в специфических случаях). А вот если пишите приложения какие-то, можно уже задуматься ибо если вам придется реализовывать весь бойлерплейт, да еще и не будет DI то с высокой долей вероятности (все же нормальные разработчики существуют) вы получите шматок гуано дико связанный и приносящий боль при рефакторинге. А еще использование только jQuery это на 99% отсутствие каких-либо тестов на фронтэнде.

    p.s. Я на ангуляре пишу админки к примеру для своих проектов. Ну и все все все что вписывается в концепцию SPA. Реакт планирую использовать как альтернативу phonegap (react-native вышел), поскольку он является слоем абстракции над формированием представления (за счет промежуточного виртуального DOM).
    Ответ написан
    1 комментарий
    1 комментарий

  • С помощью чего собирается этот проект?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Собрать в один файл можно через es6-module-transpiler
    Ответ написан
    Комментировать
    Комментировать

  • Как передать значение из var в div?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    data-* атрибуты для того и придумали. В целом все как и при работе с обычными отрибутами, единственное но, забирать их у элемента можно так:

    $(element).data('some-prop');
// или для ванильки
element.dataset.someProp


    www.sitepoint.com/use-html5-data-attributes
    Ответ написан
    Комментировать
    Комментировать

  • PhoneGap + CORS: как авторизовать с помощью AJAX-запроса?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    не используйте куки для хранения данных, ибо они для обмена каким-то состоянием между клиентом и сервером. На клиенте у вас есть LocalStorage или SessionStorage.

    Что до CORS - можно запускать хром с --disable-web-security если влом сделать CORS на сервере, что не так много времени занимает.
    Ответ написан
    Комментировать
    Комментировать

  • DOM или фреймворк?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Часто ли приходится использовать DOM в frontend

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

  • Как организовать работу в менеджере событий?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    рекомендую ActiveMQ или еще лучше GearMan. У них есть выполнение отложенное выполнение тасков, таски по рассписанию и т.д.
    Ответ написан
    5 комментариев
    5 комментариев

  • Как разобраться с typescript?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Начните с ES6. TypeScript это тот же ES6/7 + плюшки.

    Собственно "классы" в TS или в ES6 это всего-лишь сахар над старыми добрыми прототипами, что бы не писать все руками через Object.create или Object.defineProperties
    Ответ написан
    5 комментариев
    5 комментариев

  • Будет ли грамотен такой подход в angularJS?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    А в renderArray уже городить ng-repeat? Либо все это делайте директивой, либо не парьтесь и используйте вложенный ng-repeat. Ну или если то что у вас в renderArray можно использовать отдельно - то тогда имеет смысл. Если оно именно "рендрит массив", то есть там какой-то ваш цикл который формирует DOM - лучше все же использовать ng-repeat который скорее всего всеравно будет быстрее работать.

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

  • AngularJS SPA и Symfony2, подводные камни?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Сразу ознакомьтесь: https://github.com/johnpapa/angular-styleguide

    Как писать REST Api - решать вам. Если посложнее и для самообучения - посмотрите в сторону драфта стандарта jsonapi.org

    По поводу модулей - лично мне не нравится ни ngResource и restangular (хотя этот сносно использовать). Для простых приложений подойдет любой вариант, мне же нравится моя обертка над $http. Но если обертки нет - лучше взять готовое решение. Для ваших задач подойдет любой вариант.

    По поводу services/factories - рекомендую писать приложение сразу на ES6, тогда можно будет писать нормальные сервисы. По сути различие между services и factories - в первый передается функция-конструктор, во втором - функция-фабрика. при использовании ES6 классов сервисы писать намного удобнее.

    Как проектировать приложение - тут сходу сложно будет. Тут стоит много чего почитать и не только по ангуляру или symfony. По Symfony к примеру подойдут следующие штуки: https://github.com/phptodayorg/php-must-watch
    Ответ написан
    2 комментария
    2 комментария

  • Удалить dom узел с переменой?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    пройтись циклом по каждому ряду и удалить первый td. А еще можно взять через querySelectorAll вообще все первые td-шки и удалить тоже в цикле.
    Ответ написан
    Комментировать
    Комментировать

  • Как подружить AngularJS и кастомные инпуты?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular) 
    function MyCustomInputDirective () {
    return {
        require: 'ngModel',
        link: function (scope, el, attr, ngModelController) {
             // ... а тут происходит магия
        }
    };
}
    Ответ написан
    8 комментариев
    8 комментариев

  • Кроссдоменный запрос с domain.com на api.domain.com... как?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    CORS
    Ответ написан
    2 комментария
    2 комментария

  • Что почитать чтобы писать "правильно" на JS?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Лучше прочесть что и как делать.

    Такого нет. Почитайте книжку с носорогом.
    Ответ написан
    Комментировать
    Комментировать

  • Объясните коротко, по делу что же лучше/производительнее/удобнее и в каких ситуациях?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    мне казалось что все что не .on помечено как deprecated...

    В любом случае:
    - .on - универсальный метод объеденяющий все ниже перечисленные. Всегда старайтесь использовать его.

    - .live - вешает листенер на document и проверяет источник события. Гуглить "Всплытие событий". Был еще .delegate, который делал ровно то же самое но вы сами указывали ноду на которую вешается обработчик. А теперь вопрос, что будет быстрее? Вешать обработчик напрямую на элемент или на его родителя и проверять с какого элемента этот ивент всплыл? Будет ли разница по глубине DOM дерева? Если мы дошли что чем ближе обработчик висит к целевой ноде, тем быстрее, почему вообще нужно использовать делегирование событий? Помимо упрощения работы (если DOM поменялся обработчики не нужно перерегистрировать так как контейнер не менялся и все еще хранит листенер) есть еще такой параметр как количество листенеров. Если у вас табличка аля эксель, проще повесить один листенер на контейнер чем много-тысяч на каждую ячейку.

    - .bind - просто вешает событие на элемент.

    - .click - алиас для .bind('click').
    Ответ написан
    Комментировать
    Комментировать

  • Как сделать аналог foreach и isset на javascript?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular) 
    if (api.hasOwnProperty('attachmens') && Array.isArray(api.attachments)) {
    api.attachments.forEach(function (attacment) {
    
    });
}


    Но судя по примеру кода который вы предоставили - подумайте в сторону использования шаблонов на клиенте. Жить будет проще.

    И да, и в PHP и в JS свитч можно заменить простым ассоциативным массивом. И код будет проще поддерживать, и разрастаться он не будет.

    var tpl = {
    photo: ''tpl for photo,
    audio: 'some other tpl'
};
    Ответ написан
    Комментировать
    Комментировать

  • Альтернативы MVC(Javascript)?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    MVC - это архитектура, а не шаблон. И архитектура эта присуща именно UI-ным штукам. На сервере просто следует выделять отдельные слои но это не будет чистым MVC.

    MVVM, MVP и т.д. это дальнейшее развитие MVC. По сути чем больше слоев и уже специализация оных - тем меньше связанность кода. Например в Angular связь между контроллером и вьюшкой поддерживает отдельный слой ($scope) - грубо говоря это ViewModel. Ну и т.д.

    Словом... лучше напишите что уже пробовали и чем вас так не устраивает MVC и зачем вы вообще загоняетесь на эту тему?
    Ответ написан
    1 комментарий
    1 комментарий

  • Web проект - чат. Что использовать с node.js + socket.io?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Вконтактик использует long polling вместо websockets. Это так, к слову. Да и лицокнига тоже.

    https://github.com/tamaspiros/advanced-chat - я думаю готовый чатик с большей частью функционала должны натолкнуть вас на ответ.

    socket.io - только транспорт. Логику придется реализовывать самостоятельно.
    Ответ написан
    1 комментарий
    1 комментарий

  • Анонимные функции JavaScript или что делают скобки?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Immediately-invoked_function_expression
    Ответ написан
    Комментировать
    Комментировать

  • Шаблона Фабрика. Правильно ли понимаю?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Суть шаблона Factory в том, что-бы не тащить зависимости вашего объекта везде где объект собственно нужен.

    function MyObject(a, b) {
    this.a = a; // это какой-то другой объект-сервис, оно для всех инстансов общее может быть
    this.b = b; // а это то, без чего наш сервис жить не может, и значение может зависеть от контекста.
}

function MyObjectFactory(a) {
    this.a = a;
}

MyObjectFactory.prototype.create = function (b) {
    return new MyObject(this.a, b);
}


    естественно граф зависимостей обычно сложнее. Да и частенько вместо целого объекта используют просто какое-то замыкание.

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