Ві
лихие нулевьіе
Alexander
Oleh
ребята, кто видел норм туториал по написанию сингл пейдж апликейшн роутеров с хистори апи,
Oleh
?
Rafael 🌵
ребята, кто видел норм туториал по написанию сингл пейдж апликейшн роутеров с хистори апи,
мне кажется стоит указать под какой фремворк тебе это нужно
Oleh
без фремворка, для обучения
Oleh
сам принцип написания
Rafael 🌵
http://krasimirtsonev.com/blog/article/A-modern-JavaScript-router-in-100-lines-history-api-pushState-hash-url
Oleh
спасисибо)
Oleh
ой
Oleh
спасибо)
Oleh
не понимаю, получаю елемент с dom через id, вставляю елемент через append child, но на странице он не отображаеться
Oleh
function p(el, obj = null, arr = null) {
let elem = document.createElement(el);
for(let key in obj){
elem.setAttribute(key, obj[key]);
}
/*if(arr){
arr.forEach( function(item) {elem.appendChild(item())});
}*/
let c = document.getElementById('app');
c.appendChild(elem);
console.log(c);
};
p('div', {textContent: 'Привет, JS!'});
Oleh
разобрался
Vitaly
Ребят, кто-нибудь пилил либу для работы с facebook marketing api на ноде?)
anoru
Но многие не шибко шарят в CSS, кстати. Мне кажется, фронтендеры скоро расслоятся на верстал и программистов.
Дак они же наоборот смержились
anoru
Поясните за свг, ни разу с ним не работал
Фигачишь каждую svg как реакт компонент в папочку иконок и можешь передавать ей разные параметры пропсами, манипулировать несколькими цветами сразу. Да еще и через ксс менять. :D
hlomzik
anoru
не нужно
anoru
свг в виде компонент одна из киллер фич реакта
anoru
можно управлять чем угодно. 10 из 10
anoru
Тупо беру исходник свгшки, прогоняю оптимайзером. Создаю иконку svg компонент, вставляю туда, заменяю значения на пропсы. Вставляю дефолт значения. Профит
anoru
если надо изменить через ксс, то вешаю еще и классы. Но чаще пропсами
anoru
Чтобы прочитать описание, пробовать не нужно
hlomzik
блин, такие одинаковые названия. я какую-то использовал, как раз получалось изменять внешние стили
hlomzik
позже код свой найду
Anonymous
Выполняю
babel ./*.js.flow --out-dir ./
Хочу, чтобы на выходе были не file.js.js, а file.js.
Anonymous
Есть возможность задать какую-нить маску файла?
Processor
Выполняю
babel ./*.js.flow --out-dir ./
Хочу, чтобы на выходе были не file.js.js, а file.js.
попробуй просто из строчки js убрать
Processor
может он подразумевается автоматом
Anonymous
попробуй просто из строчки js убрать
Команда babel ./*.flow --out-dir ./ даст такой же результат.
Дима
У тебя опять свой особый кейс 🙃
Дима
Просто не пиши с расширением flow)
Anonymous
У тебя опять свой особый кейс 🙃
Да ничего особого. Просто нужно обеспечить возможность сделать так:
import BotClient from 'my-package/BotClient';
Вот как я решаю этот вопрос на данный момент:
"scripts": {
...
"build:src": "babel src --out-dir lib",
"build:client":
"babel BotClient.js.flow -o BotClient.js",
...
Boris
var theThing = null;
var replaceThing = function () {
var priorThing = theThing; // hold on to the prior thing
var unused = function () {
// 'unused' is the only place where 'priorThing' is referenced,
// but 'unused' never gets invoked
if (priorThing) {
console.log("hi");
}
};
theThing = {
longStr: new Array(1000000).join('*'), // create a 1MB object
someMethod: function () {
console.log(someMessage);
}
};
};
setInterval(replaceThing, 1000); // invoke `replaceThing' once every second
Boris
объясните плиз почему утечка памяти
Boris
если насколько я знаю существует оптимизация. на сохранение в метаобъекте замыкания только тех ключей что реально используются
Ві
сложно(
Ві
а че профайлер говорит?
Name
var theThing = null;
var replaceThing = function () {
var priorThing = theThing; // hold on to the prior thing
var unused = function () {
// 'unused' is the only place where 'priorThing' is referenced,
// but 'unused' never gets invoked
if (priorThing) {
console.log("hi");
}
};
theThing = {
longStr: new Array(1000000).join('*'), // create a 1MB object
someMethod: function () {
console.log(someMessage);
}
};
};
setInterval(replaceThing, 1000); // invoke `replaceThing' once every second
проблема в возврате замыкания someMethod
профайлер показывает, что утечка возникает из-за того, что someMethod в окружении имеет доступ к определённому до этого priorThing, а этот priorThing содержит свой someMethod, у которого в окружении есть priorThing из предыдущего вызова, и так ссылки прослеживаются до исходного вызова и соответственно все остальные ссылки с priorThing (твоя строка) тоже хранятся, так как в глобальном theThing всегда есть тот someMethod
решается просто: до присваивания var priorThing = theThing; надо удалять ссылки на theThing от предыдущего вызова при помощи theThing = null;
CherryTea
всё круто, живые элементы, можно фигурам выдавать айдишники и манипулировать этими фигурами как хош на кейфреймсах или через jquery animate (а вот и нет, кваери не видит свойст fill и stroke - ну это цвет заливки и обводки) и приходиться подключать ColorHook что бы он развидел
Есть хак, называется fill= "currentColor".
CherryTea
Не, серьёзно, в атоме это сделано элегантно:
Все эти точки показываются только в строке, на которой стоит курсор
В vsc есть все тоже самое что есть в атоме, только он быстрее и менее прожорлив
Paco
Кто то писал WebExtension для браузера?
Anatoly
Подскажите, как сейчас правильно пишется современный JS не для SPA, а когда есть сайт и есть много страниц. На каждой странице есть своя какая-то небольшая логика с анимацией и отправкой форм. В текущей версии, есть один большой JS бандл, который, если грубо говорить выглядит вот так:
if (exist elements on page 1) { handle elements on page1 }
if (exist elements on page 2) { handle elements on page2 }
…
if (exist elements on page 10) { handle elements on page10 }
Соответственно, суть вопросов заключается в том, что стоит ли разбивать бандл на части для каждой страницы, если он < 1мб? Если разбивать бандл на части для страниц, то как это организовать на том же webpack?(для каждой страницы новый entry point?)
Если не разбивать бандл, а оставить один целиковый для всех страниц, то как быть с этими проверками, что мы должны вызвать логику для элементов текущей страницы?
Anatoly
dynamic import - это XHR, если я правильно понимаю, но нужен ли, когда можно вместе со страницей отдать(script src) ?
Anatoly
Даже если так, то ок, берем вебпак 2, и entry point превращается в вот такую штуку:
if (exist elements on page 1) { import(blah1) }
if (exist elements on page 2) { import(blah2) }
…
if (exist elements on page 10) { import(blah10) }
Azein
Ты несколько не те вещи сравниваешь
Ві
dynamic import - это XHR, если я правильно понимаю, но нужен ли, когда можно вместе со страницей отдать(script src) ?
разве? динамик импорт ето когда в память не все сразу попадает, вроде б
Ві
то же самое что и чанки
Anatoly
Хах, и в какой же оно памяти то хранится? ) Где-то между сервером и браузером? )
Anatoly
Или память, ты имеешь в виду рантайм?
Ві
рантайм
Ві
если б можно бьіло на более низком уровне просто подключать скрипт на страницу и без конфликтов версий - бьіло б отлично
Ві
привет виджетьі на вебпаке
Anatoly
Понятненько
Ві
вот такое нашел https://medium.com/@akaaustin/building-react-widget-libraries-using-webpack-e0a140c16ce4#.2wlcbeidp
Anonymous
Всем привет! Нужна помощь в изучении js. Вообщем нужен коуч по JS. Естественно за оплату. У кого есть время и желание помочь, отпишитесь пожалуйста!
melvin
Serhii
Ого, я мог у студентов оплату брать?
hlomzik
если б можно бьіло на более низком уровне просто подключать скрипт на страницу и без конфликтов версий - бьіло б отлично
именно так оно и есть, лол) на более низком уровне)
hlomzik
это не цель и даже не средство
Anonymous
Anonymous
Как вот эта хуйня работает?
Anonymous
Почииииму
hlomzik
По-умному это называется каррирование. Функции, которые возвращают функции, в которых часть аргументов уже зашита, потому что они созданы в замыкании, в котором есть уже инициализированная часть.
Anonymous
Откуда он знает что 5 надо в number передать?
Anonymous
Ну и да, что записывается в twice
hlomzik
Откуда он знает что 5 надо в number передать?
learn.javascript.ru
не возвращаться до полного изучения курса
hlomzik
объяснить не сильная проблема (наверное). но это настолько базовые вещи, что после них будет еще тысяча вопросов
Anonymous
Все, понял. Мы просто записали в переменную ту внутреннюю функцию
Anonymous
Ах, все так просто оказалось
Anonymous
Целиком функцию записали, охуеть
hlomzik
"внутреннюю" функцию в замыкании
hlomzik
молодой человек, вы ошиблись чатом, паскаль за другой дверью