Владимир Проскурин

Надо понимать ваши задачи. Если у вас много данных (бэкапы, архивы, фото, виртуалки и.т.д.) то вам нужен объемный диск, и HDD будет дешевле.

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

А на рабочей машине не должно быть важных данных. Все должно бэкапится, все исходники быть репозитории, документы в системе документооборота, важные файлы в облаке или локальном файловом хранилище и.т.д.
С рабочей машиной может случится все что угодно.

Проще всего, вот так

let year = arr.time.slice(0, 4);
let month = arr.time.slice(4, 6);
let day = arr.time.slice(6, 8);

let date = new Date(year, month-1, day)

если вам еще таймзона нужна, ее по аналогии хватаете.

Никак. Я как раз и ставлю adblock,ublock, чтобы блочить такие штуки, и если они все таки проскальзывают, я просто раздраженно закрываю вкладку. Не пытайтесь людям подсунуть то, что они не любят.

Чтобы создать квадрат, нужно указан нужную ширину блоку, не указывать высоту, добавить :after, и ему уже указать padding-bottom: 100%
пример https://jsfiddle.net/Vlad_IT/qb3xo02j/

Ну, можно обернуть весь текст (заголовок и описание) в отдельный блок, который будет на том же уровне, что и блок с картинкой, и добавить родителю align-items: center. Ну плюс еще всякие отступы.
Получится так
jsfiddle.net/Vlad_IT/4qo65sge

Режим гадалка: on

Полагаю, в условии

if (Date.now() - Number(name.split('___')[1]) >= 10000) {

нужно name заменить на elem? т.к. name это просто имя, а elem это пара имя__дата.

Никогда не пишите в render код/функции, которые меняют состояние setState, т.к. почти за каждым setState следует render, а render опять вызовет setState, а тот опять render - и так вечно, что у вас и происходит. Вы можете вызвать checkUserBd внутри componentDidMount.

<script>
this.axios({
  method: 'post',
  url: 'https://e-solution.pickpoint.ru/api/postindexpostamatlist',
  headers: {
    'Content-type': "application/json",
  },
  data: {
    PostIndex: `<? print_r ($_POST['ORDER-NUM']);?>`,
  },
})
.then(data => {
document.getElementById('rmx').innerHTML += data.data.PostamatList.map((n, ind) =>
 `<div>
    <label><img style="vertical-align: text-bottom;" src="/api/pickico.png" alt="pickpoint" />
      <input type="radio" id="PIC${ind}" name="postamat" value="Pickpoint, ${n.CitiName}, ${n.Address} (#${n.Number})">
      ${n.CitiName}, ${n.Address}, ${n.WorkTimeSMS}, <b>Стоимость доставки: <span style="color: red; font-weight:bold;"><?=$arFields[PROPERTY_BOXBERRY_VALUE]?></span> рублей</b></br></br>
    </label>
  </div>`
).join('');
});
</script>

По скорости работы, быстрее будет canvas, но он по скорости разработки будет хуже. У меня никаких тормозов на vue+svg нет, по крайней мере, до 500 объектов на холсте. Для оптимизации могу посоветовать некоторые вещи:
1) Используйте path вместо нескольких разных других фигур.
2) Для сетки не создавайте кучу линий или фигур, просто используйте pattern. Вот пример из моего проекта (он на React JSX, но не суть)

<pattern id={"bg-" + this.props.id} patternUnits="userSpaceOnUse" width="100" height="100">
    <rect width="100" height="100" fill={this.props.canvasColor}></rect>
    <g fill={this.props.canvasGridColor} style={{ fillOpacity: 0.34 }}>
        <rect width="100" height="1" y="20"></rect>
        <rect width="100" height="1" y="40"></rect>
        <rect width="100" height="1" y="60"></rect>
        <rect width="100" height="1" y="80"></rect>
        <rect width="1" height="100" x="20"></rect>
        <rect width="1" height="100" x="40"></rect>
        <rect width="1" height="100" x="60"></rect>
        <rect width="1" height="100" x="80"></rect>
    </g>
    <rect width="100" height="100" fill="none" strokeWidth="2" stroke={this.props.canvasGridColor}></rect>
</pattern>

вот так заливаю на холст

<rect style={{ 'fill': `url(#bg-${this.props.id}) #fff` }} ... />

3) Задавайте для изменяемых объектов атрибут уникальный атрибут key
4) Цельные объекты кидайте в группу, и на нее назначайте общие стили и позицию.
UPD: простой пример на 1000 объектов (можно добавить, поменяв константу COUNT_OBJECTS) с drag&drop
jsfiddle.net/Vlad_IT/81kegmxf
UPD2: вот тот же пример, только с сеткой jsfiddle.net/Vlad_IT/qt64rouL/1 если делать сетку не заливкой, а элементами, будут ощутимые тормоза.

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

Отформатируйте, и посмотрите почему

body {
    background: #f0f0f0;
}

@media screen and (max-width: 600px) {
    body {
        background: #fc0;
    }
}

.container {
    width: 600px;
}

.container {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;

}

UPD: а, еще также, при одинаковом селекторе у двух стилей (в данном случае у обычного и в media), приоритетом будет тот, что ниже в css файле. Поэтому поместите ваш media запрос ниже.

У вас есть toggle, но ей мешает то, что вы скрываете текущий кликнутый блок в closeAllPopups.
Вот так правильно https://codepen.io/anon/pen/Rvbyzg

Открываете devtools хрома, переходите на вкладку Memory, выбираете "allocation instrumentation on timeline", и жмете кнопку Start. Начнется показываться график работы с памятью. Там будут палочки, на определенный интервал времени. Это палочка заливается двумя цветами, серый - это общий объем обработанной памяти, даже тот, который почищен сборщиком мусора. А синий, это тот объем памяти, который не почищен сборщиком мусора, по той простой причине, что эта память используется.
Если остановите сканирование, то сможете выделить определенный участок на таймлайне, и посмотреть, где это добро застряло.