Юра Юриевич

1) Не влияет практически никак. Наоборот скорее будет чуть-чуть быстрее, поскольку селекторы разбираются справа налево. И движку проще одой функцией найти класс, чем сначала класс, а потом внутри найденного еще и тэги просеивать. В целом это экономия на спичках, обычно проблемы с производительностью сидят не тут.
2) В данном элементарном случае лучше цепочкой:

function add() {
    $('.field')
        .text('hello')
        .css('display', 'block');
}

А вообще, конечно, кэширование найденных узлов полезно.

1.
- Прежде всего думайте о том какой именно элемент вы ищете: div.class - означает найти все дивы с нужным классом, .class - любые элементы с нужным классом. Т.е. если вы используете div.class только по прихоти, вы как бы косячите с архитектурой.
- Помните о том что поиск элементов выполняется справа налево. Т.е. в случае с div.class вначале будут найдены все элементы с нужным классом, а уже потом среди них будут найдены все дивы. Это усложняет поиск, при огромном количестве операций в секунду, это может быть даже заметно (но тут скорее идет речь о сотнях тысяч операций)

2. Первый пример разумеется, вы кэшируете найденный элемент в переменной и jQuery делает поиск только 1 раз.

3. Вы немного неправильно воспринимаете БЭМ. Он очень хорош для огромных команд, когда десятки или даже сотни человек работают над одним проектом. Тут важно чтобы стили не пересекались, чтобы не было вложенных сложных правил которые трудно обойти, чтобы код легко переносился из одной части сайта в другую.

Для разработки простого сайта, когда разработчик один - БЭМ избыточен.

вот одно решение https://jsfiddle.net/DelphinPRO/hm3ewt1d/
есть второе, писал фиддл сюда на тостер, но не нашел. Вкратце суть: делаем justify-content, добавляем два псевдоэлемента для родителя высотой 1px и шириной, равной ширине остальных блоков. order выставляем для них больше чем у блоков.