Permalink
Browse files

Fix for Issue 1424 - Adding items to listviews on a4.1 is too slow

- Some optimizations to speed things up:
	- Modified _itemApply() to make use of item.children() and filters. Also got rid of some unused code.
	- Convert .each() in refresh() to a loop.
	- Cache some $list.jqmData() values so we don't do it for each list item.
  • Loading branch information...
jblas committed Apr 12, 2011
1 parent ac736c6 commit 98dc036ff0a15b3e1af9b910d0c0081428900a80
Showing with 17 additions and 20 deletions.
  1. +17 −20 js/jquery.mobile.listview.js
@@ -44,21 +44,15 @@ $.widget( "mobile.listview", $.mobile.widget, {
item.find( "p, dl" ).addClass( "ui-li-desc" );
- $list.find( "li" ).find( ">img:eq(0), >:first>img:eq(0)" ).addClass( "ui-li-thumb" ).each(function() {
- $( this ).closest( "li" ).addClass( $(this).is( ".ui-li-icon" ) ? "ui-li-has-icon" : "ui-li-has-thumb" );
+ var children = item.children();
+ children.filter("img:eq(0)").add(children.eq(0).children("img:eq(0)")).addClass( "ui-li-thumb" ).each(function() {
+ item.addClass( $(this).is( ".ui-li-icon" ) ? "ui-li-has-icon" : "ui-li-has-thumb" );
});
- var aside = item.find( ".ui-li-aside" );
-
- if ( aside.length ) {
- aside.each(function(i, el) {
- $(el).prependTo( $(el).parent() ); //shift aside to front for css float
- });
- }
-
- if ( $.support.cssPseudoElement || !$.nodeName( item[0], "ol" ) ) {
- return;
- }
+ item.find( ".ui-li-aside" ).each(function() {
+ var $this = $(this);
+ $this.prependTo( $this.parent() ); //shift aside to front for css float
+ });
},
_removeCorners: function(li){
@@ -74,25 +68,28 @@ $.widget( "mobile.listview", $.mobile.widget, {
$list = this.element,
self = this,
dividertheme = $list.jqmData( "dividertheme" ) || o.dividerTheme,
+ listsplittheme = $list.jqmData( "splittheme" ),
+ listspliticon = $list.jqmData( "spliticon" ),
li = $list.children( "li" ),
counter = $.support.cssPseudoElement || !$.nodeName( $list[0], "ol" ) ? 0 : 1;
if ( counter ) {
$list.find( ".ui-li-dec" ).remove();
}
- li.each(function( pos ) {
- var item = $( this ),
+ var numli = li.length;
+ for (var pos = 0; pos < numli; pos++) {
+ var item = li.eq(pos),
itemClass = "ui-li";
// If we're creating the element, we update it regardless
if ( !create && item.hasClass( "ui-li" ) ) {
- return;
+ continue;
}
var itemTheme = item.jqmData("theme") || o.theme;
- var a = item.find( ">a" );
+ var a = item.children( "a" );
if ( a.length ) {
var icon = item.jqmData("icon");
@@ -113,7 +110,7 @@ $.widget( "mobile.listview", $.mobile.widget, {
itemClass += " ui-li-has-alt";
var last = a.last(),
- splittheme = $list.jqmData( "splittheme" ) || last.jqmData( "theme" ) || o.splitTheme;
+ splittheme = listsplittheme || last.jqmData( "theme" ) || o.splitTheme;
last
.appendTo(item)
@@ -133,7 +130,7 @@ $.widget( "mobile.listview", $.mobile.widget, {
corners: true,
theme: splittheme,
iconpos: "notext",
- icon: $list.jqmData( "spliticon" ) || last.jqmData( "icon" ) || o.splitIcon
+ icon: listspliticon || last.jqmData( "icon" ) || o.splitIcon
} ) );
}
@@ -199,7 +196,7 @@ $.widget( "mobile.listview", $.mobile.widget, {
if ( !create ) {
self._itemApply( $list, item );
}
- });
+ }
},
//create a string for ID/subpage url creation

8 comments on commit 98dc036

@CrushYar

This comment has been minimized.

Show comment
Hide comment
@CrushYar

CrushYar Apr 13, 2011

I load data for list using ajax and after call listview('refresh'); ui-li-has-icon class not applied for items with
before this cpommit only first item was rendered without ui-li-has-icon

I load data for list using ajax and after call listview('refresh'); ui-li-has-icon class not applied for items with
before this cpommit only first item was rendered without ui-li-has-icon

@jstabinger

This comment has been minimized.

Show comment
Hide comment
@jstabinger

jstabinger Apr 15, 2011

This seems to produce a JS error as well...

This seems to produce a JS error as well...

@jblas

This comment has been minimized.

Show comment
Hide comment
@jblas

jblas Apr 15, 2011

Contributor

@CrushYar

This should be fixed by this checkin:

8c71ee5

@epsd

Do you have a sample? I wasn't seeing any errors when I landed the patch. What is the error?

Contributor

jblas replied Apr 15, 2011

@CrushYar

This should be fixed by this checkin:

8c71ee5

@epsd

Do you have a sample? I wasn't seeing any errors when I landed the patch. What is the error?

@jblas

This comment has been minimized.

Show comment
Hide comment
@jblas

jblas Apr 15, 2011

Contributor

@epsd

Also, are you using a minified version?

Contributor

jblas replied Apr 15, 2011

@epsd

Also, are you using a minified version?

@jstabinger

This comment has been minimized.

Show comment
Hide comment
@jstabinger

jstabinger Apr 15, 2011

No, I copied the code out (line by line, from above) and replaced what was in a4.1. The error was about a missing bracket } or some such. I have since reverted back.

No, I copied the code out (line by line, from above) and replaced what was in a4.1. The error was about a missing bracket } or some such. I have since reverted back.

@jblas

This comment has been minimized.

Show comment
Hide comment
@jblas

jblas Apr 15, 2011

Contributor

@epsd

So you manually patched from the diff above? Does it happen if you just copy the entire listview.js source and paste it into your file instead of patching?

I was poking around on the test site, which has this patch still and I'm not seeing any errors.

Also are you testing against a minified version? Or the full version that you patched?

Contributor

jblas replied Apr 15, 2011

@epsd

So you manually patched from the diff above? Does it happen if you just copy the entire listview.js source and paste it into your file instead of patching?

I was poking around on the test site, which has this patch still and I'm not seeing any errors.

Also are you testing against a minified version? Or the full version that you patched?

@dlfajen

This comment has been minimized.

Show comment
Hide comment
@dlfajen

dlfajen Apr 27, 2011

Any idea when this fix might be released? Maybe alpha 4.2 or beta? We are wanting to go to production on May 17th and really need this fix. Otherwise we'll need to revert back to alpha 3.

Any idea when this fix might be released? Maybe alpha 4.2 or beta? We are wanting to go to production on May 17th and really need this fix. Otherwise we'll need to revert back to alpha 3.

@toddparker

This comment has been minimized.

Show comment
Hide comment
@toddparker

toddparker Apr 27, 2011

Contributor

@dlfajen This issue has been fixed in master so you can just grab the latest now and be all set. We are probably going to just move onto beta 1 but that won't happen in the near term so doing a build or grabbing the daily would be the way to go:
http://jquerymobile.com/blog/2011/04/16/nightly-and-up-to-date-builds/

Contributor

toddparker replied Apr 27, 2011

@dlfajen This issue has been fixed in master so you can just grab the latest now and be all set. We are probably going to just move onto beta 1 but that won't happen in the near term so doing a build or grabbing the daily would be the way to go:
http://jquerymobile.com/blog/2011/04/16/nightly-and-up-to-date-builds/

Please sign in to comment.