Потому что когда мы создали новый инстанс (объект)
new Article();
this внутри конструктора стал ссылаться именно на этот интсанс , Article же ссылается на саму функцию-конструктор Article, куда мы и добавили свойство count и метод ShowStats;
Наглядно это можно увидеть сделав console.log одного из инстансов и проинспектировав свойство конструктор его прототипа.

Внутри конструктора при создании инстанса мы хотим инкрементировать именно свойство на этом конструкторе, инстансы свойства count не имеют, соответсвенно this.count++ превратится в this.count = undefined + 1 == NaN.

Article.count сответственно останется равным 0. Article.result будет равен undefined, потому что на конструкторе он вообще не был объявлен, и теперь будет являтся свойством инстанса.

(angular не использует vdom, для него история другая)

перерисует целиком свой виртуальный dom

Давайте немного проясним: виртуальный DOM - это грубо говоря js объект содержащий другие объекты.
При добавлении нового сообщения туда добавится новый объект и весь DOM сравнится со старой версией с помощью diff-алгоритма специфичного для конкретного фреймворка.
И только результат этого сравнения добавится в реальный DOM.
Работа с объектом значительно быстрее работы с самим DOM-ом, поэтому чтобы оно начало работать заметно медленее у вас должен быть дикий уровень вложенности или очень большой DOM.

100 сообщений и 50 контактов - это небольшие цифры, с таким любой из упомянутых фреймворков справится без просадок.

Вот пример бенчмарков с большим количеством объектов(1000+) для многих фреймворков на примере незамысловатой таблицы:
www.stefankrause.net/js-frameworks-benchmark6/webd...
(там же есть ссылка на репо чтобы увидеть как она выглядит)
Как видите, там в таблицу уже содержащую 10 000 добавляется еще 1000(!) объектов, и многие фреймворки впонле с этим справляются.

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

Читайте файлы/директории и генерируйте инстансы в цикле.
Или используйте те же глобы для генерации.

(с глобами, код не мой, но суть та же)

const path = require('path');
const glob = require('glob');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const config = {};

glob.sync(`${basePath}/src/layouts/*.?(pug|jade)`).forEach(item => {
  config.plugins.push(
    new HtmlWebpackPlugin({
      filename: `${path.basename(item, path.extname(item))}.html`,
      template: item
    })
});