patrickmarabeas / ng-FitText.js

An AngularJS directive for inflating web type.
http://patrickmarabeas.github.io/ng-FitText.js
MIT License
222 stars 61 forks source link

FitText makes the $digest cycle repeat a lot of times, and transition time becomes really long #60

Open louisdoe opened 7 years ago

louisdoe commented 7 years ago

Hey

thanks for ng-FitText, which is great.

I am using it in an Ionic (1) app, and I am experiencing big performance issue when transitionning to a page that contains a fittext directive. The digest cycle is called again several times, and my users can wait 5 seconds to see the next page.

One of the fittext directive is on the items of a ng-repeat.

<ion-slide ng-repeat="s in sliderPages">
                    <ul>
                        <!-- <li ng-repeat="item in prodata | matchingProBrand:data.computed.proName:data.computed.proBrand | limitTo:s*sliderItemNumber+sliderItemNumber  | limitTo:-sliderItemNumber"> -->
                        <li ng-repeat="item in suggestionList | limitTo:s*sliderItemNumber+sliderItemNumber:s*sliderItemNumber ">
                            <a class="suggestPro item-content" ng-click="itemID=item.id;changeisFlash();launchComputeService(item.id);">
                                <span><img ng-src={{imagesUrls[item.imageName]}} /></span>
                                <p class="flex-caption" ng-class="item.fun == '0' ? 'aNormal' :( item.fun == '1' ? 'aSmallWave' : (item.fun == '2' ? 'aStepUp' : ''))" fittext fittext-min="8" fittext-max="12" ng-bind="item.model + ' - ' + (item.name | split:' ':0)" > {{item.model}} - {{item.name | split:' ':0}}</p> 
                            </a>
                        </li>
                    </ul>
                </ion-slide>

Do you have an idea to help me on this ?

patrickmarabeas commented 7 years ago

Try setting data-fittext-load-delay to something longer than the expected transition. If that fixes the problem then it'll probably mean adding some checks around whether the parent has a width or something.

If it's possible to whip up a quick demo on JSBin or whatnot showing the bug, that would be mighty helpful.

louisdoe commented 7 years ago

Hi Patrick

thanks a lot for your response.

The thing is the transition time strongly depends on the device, so I cannot set a delay for fittext. If too long, the UX will be bad, and if too short, the transition time can get up to 4 or 5 seconds.

Setting up a demo would take long, but I can give you access to my code, would like that ?

Thanks !

2017-06-08 3:47 GMT+02:00 Patrick Marabeas notifications@github.com:

Try setting data-fittext-load-delay to something longer than the expected transition. If that fixes the problem then it'll probably mean adding some checks around whether the parent has a width or something.

If it's possible to whip up a quick demo on JSBin or whatnot showing the bug, that would be mighty helpful.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/patrickmarabeas/ng-FitText.js/issues/60#issuecomment-306974514, or mute the thread https://github.com/notifications/unsubscribe-auth/AD1Gi5ab0wp9h6Onx8Tw_Z4f4tDfUnBSks5sB1KogaJpZM4Ny5EP .

patrickmarabeas commented 7 years ago

I only suggest for debugging - if using delay on fittext fixes the issue of transition time, then it's a base from which to patch.

Happy to have code access - I'll get to it as quickly as I can.

louisdoe commented 7 years ago

Hi Patrick

your trick fixed my problem. Plus, I removed some places where I didn't really need fittext.

Do you still need code access to see for yourself ? I can give you this.

Thanks

2017-06-10 7:41 GMT+02:00 Patrick Marabeas notifications@github.com:

I only suggest for debugging - if using delay on fittext fixes the issue of transition time, then it's a base from which to patch.

Happy to have code access - I'll get to it as quickly as I can.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/patrickmarabeas/ng-FitText.js/issues/60#issuecomment-307544426, or mute the thread https://github.com/notifications/unsubscribe-auth/AD1Gi86xqsknwnr0tBbxlxq3sJru0dpNks5sCiyMgaJpZM4Ny5EP .

patrickmarabeas commented 7 years ago

In terms of easily testing against the problem, yes that would be helpful.