[bug] Site performance op Windows Phone 8.1

[PaT]

http://mobile.theverge.co...t-explorer-mobile-changes

Misschien even wachten. Krijgen we straks een webkit achtige browser???

[BM]

PaT schreef op donderdag 31 juli 2014 @ 21:38:
http://mobile.theverge.co...t-explorer-mobile-changes

Misschien even wachten. Krijgen we straks een webkit achtige browser???

Zoals ik het lees werden alle webkit prefixed zaken voorheen genegeerd, en worden ze nu zoveel mogelijk gemapped naar de (IE) standaard versie, maar ik ben geen html/browser expert

[_David_]

https://modern.ie/en-us/report#http%3A%2F%2FTweakers.net

Geeft aan dat Tweakers veel prefixed css proporties gebruikt die mogelijk voor problemen zorgen met IE

[crisp]

_David_ schreef op donderdag 31 juli 2014 @ 22:16:
https://modern.ie/en-us/report#http%3A%2F%2FTweakers.net

Geeft aan dat Tweakers veel prefixed css proporties gebruikt die mogelijk voor problemen zorgen met IE

Onzin, we gebruiken bijna overal ook de unprefixed versies.

[Ramon]

Ik ben weer even verder gegaan waar ik gisteren was geeindigd en heb een artikelpagina in de responsive variant genomen op de site zelf (dus zonder de pagina te saven via de browser). Vooral gekeken naar de CSS van #contentArea.

Om het vloeiend te krijgen.... twee opties:


overflow: hidden uitzetten = vloeiend.


Alle vier de border-radiussen uitzetten = vloeiend.

Dus ik heb de volgende CSS rule in mijn custom CSS gezet, en tot nu toe gaat het op mijn telefoon (lumia 925 met 8.1 final) best aardig soepel, met nauwelijks meer witte vlakken.

code:

#contentArea
{
border-radius: 0px;
}

Ben benieuwd of dit bij anderen ook werkt?

[ Voor 3% gewijzigd door Ramon op 01-08-2014 08:37 ]

[jorisjan]

lijkt hier te werken. (Ativ S wp 8.1 dp)

Scrollen gaat soepeler en de site laadt ook stukken sneller

Kuddo's voor je werk

[Caelorum]

Werkt hier ook vreemd genoeg met mijn L920 8.1dp

[crisp]

De border-radius heb ik in de lopende iteratie gereset voor grade C en D aangezien hij daar toch nutteloos was en dit dus de grootste veroorzaker lijkt te zijn. IE lijkt dus gevoelig voor dergelijke styling op fysiek grote elementen.

edit: ik heb de border-radius nu zelfs default helemaal weggelaten en alleen toegepast indien er ueberhaupt sprake is van een border (in het geval je een grijze achtergrond hebt gekozen op grade A)

We gaan nog kijken naar de andere punten die genoemd zijn zoals de dotted border naast reacties waar wellicht nog meer winst te boeken valt.

Dankzij het werk van Ramon hebben we nu duidelijke aanknooppunten. Zonder zijn hulp waren we niet zo ver gekomen, dus in ieder geval alvast mijn persoonlijke dank daarvoor!

[ Voor 15% gewijzigd door crisp op 01-08-2014 09:18 ]

[Miki]

Hier op mijn Lumia 930 is het probleem met RD verholpen door de custom CSS in te laden met de fix, ik ben een gelukkig man

Thx Ramon

[ Voor 3% gewijzigd door Miki op 01-08-2014 09:28 ]

[RayNbow]

Ramon schreef op donderdag 31 juli 2014 @ 23:11:

code:

#contentArea
{
border-radius: 0px;
}

Ben benieuwd of dit bij anderen ook werkt?

Lijkt te werken op een L1020.

[Razr]

Hier werkt het nu ook zoals het zou moeten - dit is op een L925 met WP 8.1 (dp). Super! Kudo's voor Ramon.

[DarkFly]

Ramon schreef op donderdag 31 juli 2014 @ 23:11:

code:

#contentArea
{
border-radius: 0px;
}

Ben benieuwd of dit bij anderen ook werkt?

Ramon, complimenten voor je werk! Ik heb deze code nu ook ingesteld als custom CSS en op mijn Nokia Lumia 930 werkt Tweakers nu echt een heel stuk beter!

[Inspector]

Ramon, top uitgezocht! Ik heb zelf lopen spitten in de JS daar ik dacht hier het probleem als eerste te vinden. Hoe dan ook, blij dat er nu schot in de zaak lijkt te komen. Dat een simpele border-radius zoveel roet in het eten van IE kan gooien vind ik echter zeer bewonderenswaardig. De browser is bij mij dan voorlopig ook nog niet van zijn slechte naam af

[Migrator]

Ramon: Hulde voor je werk, jammer dat ik geen karma aan je kan doneren

Zul je overigens net zien dat nu de oplossing/een fix gevonden is, we updaten we naar 8.1.1 en het probleem is opgelost nieuws: Microsoft verbetert siteweergave IE op Windows Phone

[SherlockHolmes]

Ramon schreef op donderdag 31 juli 2014 @ 23:11:
Ik ben weer even verder gegaan waar ik gisteren was geeindigd en heb een artikelpagina in de responsive variant genomen op de site zelf (dus zonder de pagina te saven via de browser). Vooral gekeken naar de CSS van #contentArea.

Om het vloeiend te krijgen.... twee opties:

[afbeelding]
overflow: hidden uitzetten = vloeiend.

[afbeelding]
Alle vier de border-radiussen uitzetten = vloeiend.

Dus ik heb de volgende CSS rule in mijn custom CSS gezet, en tot nu toe gaat het op mijn telefoon (lumia 925 met 8.1 final) best aardig soepel, met nauwelijks meer witte vlakken.

code:

#contentArea
{
border-radius: 0px;
}

Ben benieuwd of dit bij anderen ook werkt?

Geweldig werk man, echt geniaal, het werkt perfect! Dank!

[PaT]

Zo, eindelijk de kans gehad je werk te testen Ramon. Ook hier op een Lumia 925 met DP dikke prima met je custom css.

Heel veel dank voor je noeste werk. Precies om deze reden vind ik de community van Tweakers zo mooi. Thumbs up!

[Whatson]

Hier mag best wel een artikeltje aan gewijd worden op de FP.

Top Ramon, werkt hier ook op de L925 met DP8.1

[Martinspire]

Wat ik me afvraag is hoe dat in hemelsnaam voor problemen kan zorgen. Ook overflow: visible (of was het hidden) zou geen probleem moeten leveren, al zou dat bij dergelijke weergaves toch ook geen probleem moeten geven?

[Shunt]

Alleen jammer dat arme sloebers als ik niet genoeg karma hebben om custom css aan te zetten.

[Raven]

Is er geen Stylish voor WP8.1? Wikipedia: Stylish

[ Voor 53% gewijzigd door Raven op 02-08-2014 10:42 ]

[Inspector]

Shunt schreef op zaterdag 02 augustus 2014 @ 10:28:
Alleen jammer dat arme sloebers als ik niet genoeg karma hebben om custom css aan te zetten.

Dinsdag wordt er gereleased en zou het probleem grotendeels voor iedereen opgelost moeten zijn.

[Caelorum]

Raven schreef op zaterdag 02 augustus 2014 @ 10:41:
Is er geen Stylish voor WP8.1? Wikipedia: Stylish

Nee, geen addons mogelijk voor IE en ook geen software die al het verkeer afvangt en kan manipuleren (en daar mogen we blij mee zijn).

[PaT]

Inspector schreef op zaterdag 02 augustus 2014 @ 10:44:
[...]


Dinsdag wordt er gereleased en zou het probleem grotendeels voor iedereen opgelost moeten zijn.

[Ramon]

Bedankt voor alle mooie woorden Ik ben ook al uitgenodigd voor lunch op het t.net hoofdkwartier, dat verwacht je niet...

Ik hoop inderdaad dat de wijzigingen snel live staan, zodat iedereen gewoon normaal van t.net gebruik kan maken

Martinspire schreef op zaterdag 02 augustus 2014 @ 09:41:
Wat ik me afvraag is hoe dat in hemelsnaam voor problemen kan zorgen. Ook overflow: visible (of was het hidden) zou geen probleem moeten leveren, al zou dat bij dergelijke weergaves toch ook geen probleem moeten geven?

Ik heb gisteren nog even heel kort in jsfiddle geprobeerd om het te reproduceren van scratch maar ik kreeg het daar niet voor elkaar. Wil je echt weten waar het aan ligt, save dan een pagina van t.net (of andere site) waar het optreedt en strip deze pagina stuk voor stuk van alles, totdat je de meeste basale pagina hebt die er is waar het nog optreed. Zou mooi zijn om een concrete testcase te kunnen overhandigen aan MS.

Ik heb dit "onderzoekje" alleen gedaan omdat er geluiden waren dat 8.1 final het probleem op de t.net site zou oplossen (supposedly door firmware die niet met de Developer Preview meekwam), terwijl het op mijn Lumia 925 mét de 8.1 final niet opgelost bleek te zijn. Eventueel verder onderzoek laat ik aan iemand anders over

Wat ik overigens denk dat er gebeurt is niet dat border-radius IE (direct) laat crashen, maar dat border-radius in combinatie met iets anders voor een constante repaint zorgt die erg veel CPU vraagt. Constant hoge CPU-load is op een telefoon natuurlijk niet zo handig omdat de batterij dan snel leeg raakt, en dat daarom Windows Phone dan IE afsluit. Het resultaat is natuurlijk hetzelfde.

[Anoniem: 80466]

Ramon schreef op zaterdag 02 augustus 2014 @ 16:57:
Wat ik overigens denk dat er gebeurt is niet dat border-radius IE (direct) laat crashen, maar dat border-radius in combinatie met iets anders voor een constante repaint zorgt die erg veel CPU vraagt.

Omdat je ook css issues vond met border-left + padding-left en met border + padding is de kans reeel dat het te maken heeft met css conflicten voor borders.
Bijvoorbeeld borders die elkaar overlappen waarbij IE de z-index van deze elementen niet goed heeft bepaald of intern telkens wijzigt. Ook heeft IE in het verleden wel eens issues gehad met resizen van elementen en daarbij kunnen borders ook snel leiden tot conflicten met andere scherm elementen.

[Martinspire]

Ik vind het wel opvallend, want IE voor Windows (8 ) heeft dat niet.

[RayNbow]

Martinspire schreef op zondag 03 augustus 2014 @ 12:03:
Ik vind het wel opvallend, want IE voor Windows (8 ) heeft dat niet.

Heeft wat niet?

[Martinspire]

RayNbow schreef op zondag 03 augustus 2014 @ 12:12:
[...]

Heeft wat niet?

Crashing/bugs met Tweakers.net

[RayNbow]

Martinspire schreef op zondag 03 augustus 2014 @ 12:49:
[...]

Crashing/bugs met Tweakers.net

Een desktop heeft dan ook veel meer resources waardoor IE11 op een pc niet crasht. Dat wil echter niet zeggen dat de bug niet aanwezig is in de Windows 8.1 versie van IE11.

[Anoniem: 80466]

Martinspire schreef op zondag 03 augustus 2014 @ 12:03:
Ik vind het wel opvallend, want IE voor Windows (8 ) heeft dat niet.

Ramon had het probleem juist gelokaliseerd met IE11 op de desktop.
Alleen zonder crash maar wel met een cpu thread die op 100% gaat lopen

[Bokkiej]

De nieuwste WP8.1 update 1 verhelpt het performanceprobleem overigens niet. (Crashen heeft hij nog niet gedaan in de twee minuten dat ik test, misschien is dat al wel beter). Ach, vanaf dinsdag sowieso weer normaal van tweakers.net genieten

[PaT]

Inderdaad, ook gelijk getest. Crashed hier op een Lumia 925 net zo hard. Snel de custom css aangezet en geen probleem meer.

[Herautr]

Op mijn Lumia 930 met WP8.1 Update 1 heb ik geen last van crashes meer.

[Shunt]

Op mijn Lumia 930 is het scrollen en warmte probleem opgelost. Scrollen en laden gaat nu met een snelheid die ik verwacht had van dit beestje.

[Ramon]

Herautr schreef op dinsdag 05 augustus 2014 @ 13:15:
Op mijn Lumia 930 met WP8.1 Update 1 heb ik geen last van crashes meer.

Ligt meer aan de update van t.net van vandaag dan aan WP8.1 Update 1

[BounceMeister]

Als ik de zoekfunctie gebruik om binnen een topic te zoeken, krijg ik resultaten van het hele forum, in de vorm van een topiclijst.
Eerder werkte dit wel goed.
Ik heb een Lumia 820 met de laatste beschikbare update, en dat is helaas niet 8.1.

[WoutervOorschot]

Heel veel hulde aan ramon en devvers van t.net! Ik kan eindelijk weer de responsive design gebruiken van tweakers
Zeer fijn om te weten dat er ook naar WP-problemen wordt gekeken!

[maartenv]

Hulde! Ik kwam er vandaag ook achter! Geen crashes meer! Ik had gisteren eerst de nieuwe 8.1 update geïnstalleerd en het leek veel erger. Vandaag zag ik dat de site er iets anders uit zag (lettertype) en nu werkt het prima op mijn 920!

[PaT]

Devs en Ramon, nogmaals

Hier een Lumia 925, draait weer als een zonnetje zonder custom css.

[BtM909]

Misschien toch even handig (devvers?) om dit door te geven aan MS?

[Max_B]

Omdat ik helaas via het MSDN forum niets kan posten (het topic staat op slot?), heb ik via de chat-support van Microsoft de oplossing aangedragen onder nummer: 1248203401
Hieronder de tekst:

I previously made notice of a bug in Internet Explorer. It caused white spaces and can stop IE on some sites. Now, a Dutch website has indicated the problem wherefore the bug doesn't exist on that site anymore. A thread of the bug is posted on: MSDN: Internet explorer crashes when visiting certain pages

User Ramon of the tech-website Tweakers found out what created the bug on IE which caused different responsive website to show white-spaces and much CPU-use, see: [bug] Site performance op Windows Phone 8.1 It even caused to crash IE on WP-devices. Ramon was debugging the Tweakers website (on IE11) and could reproduce the problem if he scaled the screen so it would show the mobile-version of the website. The bug would now appear and he found out that there is something on the page that created excessive CPU-usage. Subsequently, he was looking at the CSS of the responsive website. When he disabled overflow: visible or disabled all 4 border-radius, the site appeared to show much better without the white surfaces and high CPU-use. See:

http://i.imgur.com/PangR1d.png
http://i.imgur.com/RRezQnz.png

When people added custom CSS to the site, the bug was gone:
#contentArea

{
border-radius: 0px;
}

[ Voor 3% gewijzigd door Max_B op 08-08-2014 13:38 ]