# Ember Views Refactor

**URL:** <https://discuss.emberjs.com/t/ember-views-refactor/3402>\
**Category:** Proposals\
**Created:** [November 21, 2013, 1:59am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402 "2013-11-21T01:59:15Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![gdub](https://avatars.discourse-cdn.com/v4/letter/g/b19c9b/32.png) [@gdub](https://discuss.emberjs.com/u/gdub)\
**Post date:** [November 21, 2013, 1:59am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402/1 "2013-11-21T01:59:15Z")

</div>

Proposing a minor refactor of ember views. Mainly for improving aesthetics of the output, HTML attribute compliance, and possibly minor perf improvements.

Typical DOM node generation for a view currently looks something like this:

```
<div id="ember638" class="ember-view"></div>

```

or with an action:

```
<div id="ember639" class="ember-view" data-ember-action="3"></div>

```

The proposal is to generate this instead:

```
<div data-ember-id="638"></div>

```

or with an action:

```
<div data-ember-id="639" data-ember-action="3"></div>

```

Why?

- ‘ember-view’ class has nothing to do with styling.
- ‘ember-view’ selector is currently is only used for jQuery event delegation. Can check for existence of data-ember-id instead.
- Currently prohibits the use of your own ‘id’ attribute.
- Proper use of html5 data attributes
- Bring in-line with actions
- Reduce overall output

It doesn’t look like much work to update. Trying to see other’s thoughts before starting a PR.

---

<div class="post-metadata">

**Author:** ![samg](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/samg/32/15206_2.png) [@samg](https://discuss.emberjs.com/u/samg)\
**Post date:** [November 21, 2013, 4:34am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402/2 "2013-11-21T04:34:57Z")

</div>

Ember might rely on the performance characteristics of finding an element by id, so changing id to data-ember-id might come with performance regressions.

---

<div class="post-metadata">

**Author:** ![gdub](https://avatars.discourse-cdn.com/v4/letter/g/b19c9b/32.png) [@gdub](https://discuss.emberjs.com/u/gdub)\
**Post date:** [November 21, 2013, 5:02am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402/3 "2013-11-21T05:02:42Z")

</div>

@samg Looking at the source, they don’t appear to lookup by id in the DOM. They store every view in a global hash: `Ember.View.views` by this id for referencing.

---

<div class="post-metadata">

**Author:** ![samg](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/samg/32/15206_2.png) [@samg](https://discuss.emberjs.com/u/samg)\
**Post date:** [November 21, 2013, 5:28am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402/4 "2013-11-21T05:28:28Z")

</div>

Oh, interesting! If Ember doesn’t need to use the elements’ `id` attributes, that might make it easier to match `<label>`s with `<input>`s in forms.

---

<div class="post-metadata">

**Author:** ![marcioj](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/marcioj/32/10432_2.png) [@marcioj](https://discuss.emberjs.com/u/marcioj)\
**Post date:** [November 22, 2013, 1:38am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402/5 "2013-11-22T01:38:50Z")

</div>

> [@samg](#):
>
> Oh, interesting! If Ember doesn’t need to use the elements’ id attributes, that might make it easier to match \<label\>s with \<input\>s in forms.

It’s possible to override the id, just using id in your view. For example:

```
<label for="name">Name</label>
{{input type="text" id="name"}}

```

---

<div class="post-metadata">

**Author:** ![lukemelia](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/lukemelia/32/14206_2.png) [@lukemelia](https://discuss.emberjs.com/u/lukemelia)\
**Post date:** [November 24, 2013, 3:39am UTC](https://discuss.emberjs.com/t/ember-views-refactor/3402/6 "2013-11-24T03:39:51Z")

</div>

If this can be achieved without negative performance impact, I would be in favor of the change, likely as something that would land in 2.0.