too many components for aura - strike_row, strike_dataGrid

[siddharatha]

When am trying to display more than 1000 records in the strike_dataGrid it throws an exception when it displays huge volume of records.

The fix which worked is adding the below line on strike_dataGrid

<aura:dependeny resource="strike_row" />

[ejwill]

I think it would better to have Pagination on the data grid in this case but @siddharatha fix sounds like it should be added too

[rsoesemann]

Do you have something like infinitive scrolling on your roadmap?

[salesforcemagic]

Part of the problem is actually in the strike_row component. There are too many aura:if conditions are being evaluated unnecessarily. Also, if these are ordered by the most commonly encountered data types, you can significantly improve performance. Try replacing the TR block with the one below and let me know what improvements you see. Two other improvements that can be made are around javascript performance and the dependency reference already mentioned.

    <tr>
        <aura:iteration items="{!v.fields}" var="field" indexVar="index">
            <td data-label="{!field.label}">
                <div aura:id="value-output" class="{!if(field.dataType != 'COMPONENT', 'slds-truncate', '')}">
                    <aura:if isTrue="{!field.dataType == 'STRING'}">
                        {!field.value}
                        <aura:set attribute="else">
                            <aura:if isTrue="{!field.dataType == 'CURRENCY'}">
                                <ui:outputCurrency value="{!field.value}"/>
                                <aura:set attribute="else">
                                    <aura:if isTrue="{!field.dataType == 'NUMBER'}">
                                        <ui:outputNumber value="{!field.value}"/>
                                        <aura:set attribute="else">
                                            <aura:if isTrue="{!field.dataType == 'BOOLEAN'}">
                                                <ui:outputCheckbox value="{!field.value}"/>
                                                <aura:set attribute="else">
                                                    <aura:if isTrue="{!field.dataType == 'PERCENT'}">
                                                        <ui:outputNumber value="{!field.value}"/>%
                                                        <aura:set attribute="else">
                                                            <aura:if isTrue="{!field.dataType == 'DATE'}">
                                                                <ui:outputDate value="{!field.value}"/>
                                                                <aura:set attribute="else">
                                                                    <aura:if isTrue="{!field.dataType == 'DATETIME'}">
                                                                        <ui:outputDateTime format="M/dd/yyyy H:mm a" value="{!field.value}"/>
                                                                        <aura:set attribute="else">
                                                                            <aura:if isTrue="{!field.dataType == 'EMAIL'}">
                                                                                <ui:outputEmail value="{!field.value}"/>
                                                                                <aura:set attribute="else">
                                                                                    <aura:if isTrue="{!field.dataType == 'PHONE'}">
                                                                                        <ui:outputPhone value="{!field.value}"/>
                                                                                        <aura:set attribute="else">
                                                                                            <aura:if isTrue="{!field.dataType == 'URL'}">
                                                                                                <ui:outputURL value="{!field.value}" label="{!field.value}"/>
                                                                                                <aura:set attribute="else">
                                                                                                </aura:set>
                                                                                            </aura:if>
                                                                                        </aura:set>
                                                                                    </aura:if>
                                                                                </aura:set>
                                                                            </aura:if>
                                                                        </aura:set>
                                                                    </aura:if>
                                                                </aura:set>
                                                            </aura:if>                                                            
                                                        </aura:set>
                                                    </aura:if>
                                                </aura:set>
                                            </aura:if>                                            
                                        </aura:set>
                                    </aura:if>
                                </aura:set>
                            </aura:if>                            
                        </aura:set>
                    </aura:if>
                </div>
            </td>
        </aura:iteration>
    </tr>

[daneowens3]

added @siddharatha suggestion and expect to see the change in our next release