I am trying to implement a custom drag and drop directive. It works, but it is extremely slow, and I think the slowness can be tracked to Angular 2 because I've never encountered this slowness before. The slowness only occurs when I attach an event listener to the `dragover` or `drag` events (i.e. the events which are sent frequently), even if I do nothing but return `false` in them.

Here's my directive code:

```
import {Directive, ElementRef, Inject, Injectable} from 'angular2/core';

declare var jQuery: any;
declare var document: any;

@Directive({
    selector: '.my-log',
    host: {
        '(dragstart)': 'onDragStart($event)',
        '(dragover)': 'onDragOver($event)',
        '(dragleave)': 'onDragLeave($event)',
        '(dragenter)': 'onDragEnter($event)',
        '(drop)': 'onDrop($event)',
    }
})
@Injectable()
export class DraggableDirective {
    refcount = 0;
    jel;

    constructor( @Inject(ElementRef) private el: ElementRef) {
        el.nativeElement.setAttribute('draggable', 'true');
        this.jel = jQuery(el.nativeElement);
    }

    onDragStart(ev) {
        ev.dataTransfer.setData('Text', ev.target.id);
    }

    onDragOver(ev) {
        return false;
    }

    onDragEnter(ev) {
        if (this.refcount === 0) {
            this.jel.addClass('my-dragging-over');
        }
        this.refcount++;
    }

    onDragLeave(ev) {
        this.refcount--;
        if (this.refcount === 0) {
            this.jel.removeClass('my-dragging-over');
        }
    }

    onDrop(ev) {
        this.jel.removeClass('my-dragging-over');
        this.refcount = 0;
    }
}

```

Here's the relevant style sheet excerpt:

```
.my-log.my-dragging-over {
    background-color: yellow;
}

```

As you can see all I'm doing is highlighting the element being dragged over in yellow. And it works fast when I don't handle the `dragover` event, however I **must** handle it to support dropping. When I do handle the `dragover` event, everything slows down to unbearable levels!!

**EDIT** I am using angular beta 2.0.0-beta.8

**EDIT #2** I tried profiling the code using chrome's profiler, these are the results:

![Imgur](https://i.imgur.com/jd63pld.png)

Look at the marked line, it is strangely suspicious...

**EDIT #3** Found the problem: it was indeed due to Angular 2's change detection. The drag and drop operation in my case is done on a very dense page with a lot of bindings and directives. When I commented out everything except the given list, it worked fast again... Now I need your help in finding a solution to this!