css asynchroon laden

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Senior .NET developer gezocht die graag in de zorg

Functieomschrijving Wil jij als .NET Developer als kartrekker in een Scrum team fungeren en je helemaal uitleven in de backend met C#? Krijg jij een grotere kick van high-security en high-availability dan van een gelikte frontend? Dan past deze functie jou perfect! Programmeren van high-availability en high-security applicaties in ASP.NET en C#; Samen met je teamgenoten nieuwe applicaties/diensten ontwikkelen in .NET; Overleggen met de informatie analisten en testers; Ontwikkelen van webservices (WCF); 20% van je tijd besteden aan innovatie; Deelnemen aan projecten om nieuwe ketenpartijen toe te voegen; Bouwen van unit testen; Deelnemen aan Scrummeetings. Functie-eisen Beschikt over HBO/WO werk-

Bekijk vacature »

Werken in een van de grootste webshop/ kleding pla

Vacature Omschrijving Onze klant is een software ontwikkeling bedrijf gespecialiseerd in het bouwen van web applicaties en websites en verleent haar diensten vanuit het prachtige Noord-Brabant. Het bedrijf bestaat inmiddels alweer 14 jaar en ze hebben 7 jaar geleden de doorgroei gemaakt naar de grootste webshop. Inmiddels worden er via deze webshop meer dan 750.000 outlet (kleding) artikelen verhandeld en zijn zij landelijk gezien nu de grootste webshop/kleding platform. Er heerst een platte organisatie structuur en beide bedrijven werken vanuit 1 organisatie. 2 jaar geleden is er nog een derde partij aan toegevoegd en deze frisse en gezonde onderneming groeit

Bekijk vacature »

Junior C# .NET developer / Medische sector /

Midden in een bosrijke omgeving ten Noorden van Utrecht ligt het hoofdkantoor van deze organisatie. Een absoluut unieke locatie voor de veeleisende ontwikkelaar die alleen genoegen neemt met het beste. Deze organisatie wordt gekenmerkt als een informele club developers die graag het beste in zichzelf en hun teamgenoot naar boven halen. Van een dagelijkse verse lunch tot uiteenlopende bedrijfsactiviteiten; deze organisatie heeft het allemaal! Ze zijn gespecialiseerd in software om het voor ziekenhuizen inhoudelijk overzichtelijk te maken hoe efficiënt hun processen verlopen. Hierbij ga je te werk in scrumteams van gemiddeld 5 personen, zodat jij met je team elke dag

Bekijk vacature »

C++ Developer/ Embedded / Machinebouw

Functieomschrijving Ben jij een C++ Developer met affiniteit voor embedded development? Lijkt het jou gaaf om samen met collega-ontwikkelaars te werken aan oplossingen voor het verwerken van breekbare goederen? Lees dan snel verder! Ontwikkeling in real-time Linux omgevingen; Het programmeren van software geschreven in C++ (tegen embedded aan); Het werken in multidsciplinaire scrumteams; Het analyseren van klantwensen om zo tot ontwerpeisen te komen; Het verlenen van service voor de ontwikkelde software. Functie-eisen Hbo werk- en denkniveau; Minimaal 2 jaar ervaring in een soortgelijke functie en ervaring met C++ en OO (UML); Kennis van ontwikkeling in real-time Linux omgevingen; Ervaring met

Bekijk vacature »

C# (WPF) developer gezocht, omgeving Ridderkerk

Voor een softwarebedrijf in de omgeving van Ridderkerk, dat zich richt op een specifieke branche binnen de logistieke sector, zijn we op zoek naar een .NET C# developer met bij voorkeur kennis van WPF en MVVM. Het gaat hier om een bedrijf van circa 20 mensen met een informele leuke bedrijfscultuur en korte lijnen. Er werken meerdere .NET developers maar het team waarbinnen je komt te werken bestaat uit 3 .NET C# developers. Het product waar je aan werkt is bedrijfskritisch en wordt 24/7 gebruikt. Het is een innovatief product dat recentelijk in de markt is gezet maar waar nog

Bekijk vacature »

ASP.NET developer in webbureau

Organisatie Voor een jong en dynamisch bedrijf in de omgeving van Oss zijn we op zoek naar developers die een passie hebben voor het ontwikkelen van webapplicaties. Deze applicaties ga je met een team maken voor toonaangevende klanten. Dit kunnen MKB klanten zijn uit de regio maar ook grote multinationals. De organisatie bestaat al 10 jaar en het zijn experts als het gaat om communicatie en webapplicaties. Het bedrijf ontwikkelt e-commerce mogelijkheden zoals webshops en webapplicaties. Ook ontwikkelen zij API’s en mobiele apps. Er werken 15 mensen bij deze organisatie, dat groeiplannen heeft voor de nabije toekomst. Je gaat werken

Bekijk vacature »

Junior Software Developer / Magic XPA / DB2 / maat

Functieomschrijving Heb jij al enige ervaring met Software Development en wil je je graag verder ontwikkelen bij een internationaal bedrijf in regio Eindhoven? Lees dan snel verder! Software ontwikkeling met technieken als Magic XPA en DB2 relationele databases. Ontwikkelen van nieuwe onderdelen van het centrale (maatwerk) softwarepakket. Uitbreiden bestaande functies binnen het pakket. Wensen en eisen van gebruikers in kaart brengen. Meedraaien in projecten. Informatieanalyses maken en uitwerken. Jezelf ontwikkelen binnen de organisatie, bijvoorbeeld op het gebied van BI of integratie met behulp van SAP PI/PO. Ondersteunen van de helpdesk bij software issues. Functie-eisen 1 tot 3 jaar ervaring op

Bekijk vacature »

Frontend Developer / React.js / JavaScript / Fraud

Functieomschrijving Wil jij als frontend ontwikkelaar de volgende stap zetten en aan de slag gaan met o.a. React.JS? Wil jij zelf ook je stempel drukken en hen leren met nieuwe frameworks aan de slag te gaan? Lees dan nu verder! Functie-eisen Minimaal HBO werk- en denkniveau; Bij voorkeur minimaal 3 jaar ervaring; Bedrijfsomschrijving Het bedrijf waar je als front-end developer komt te werken is een organisatie die rechtmatigheid van financiële gegevens in de zorg controleert. Hierin opereren ze geheel onafhankelijk en zijn ze ondertussen marktleider op dit gebied geworden. Ondanks dat het om een klein bedrijf gaat werken ze voor

Bekijk vacature »

Medior .NET developer / Azure /

Deins jij niet terug voor een uitdaging? Heb jij passie voor het vak en zit je het liefst de hele dag met de vingers aan de knoppen? Ben je communicatief vaardig en wil je werken met de nieuwste technieken in een proactief team van enthousiaste developers? Dan ben ik op zoek naar jou! De organisatie Deze organisatie is gespecialiseerd in de ontwikkeling van hypotheeksoftware. Het is jouw doel om het voor de eindgebruiker zo makkelijk mogelijk te maken om alles te regelen omtrent zijn/haar hypotheek. Zo heeft de klant de behoefte om veilig in te kunnen loggen op de online

Bekijk vacature »

Vacature Senior PHP developer

Organisatie 25 jaar geleden zijn zij begonnen en vanaf het moment dat internet bestond tot aan nu, marktleider in hun vakgebied. Met een team van 15 medewerkers zitten zij gevestigd in een mooi pand in Capelle aan den Ijssel. Dagelijks zorgen zij er voor dat hun afnemers (Groothandels, fabrikanten, producenten) dagelijks weer kunnen genieten van hun producten. Zij zijn gespecialiseerd in het maken van geavanceerde B2B webshops, PIM systemen en het automatisch genereren van papieren catalogi, prijslijsten en datasheets. Zij ontwikkelen niet alleen de “standaard” software, maar ze verzorgen voor hun klanten het gehele project van het ontwerp tot en

Bekijk vacature »

Technisch Ontwerper / Applicatieontwikkelaar max.

Wie zoeken we? Je bent de beste in je vak of hebt de ambitie en de potentie om de beste te worden. Je hebt de passie om nieuwe technologieën te blijven leren en continu jezelf te ontwikkelen. Je hebt de pioniersgeest en drive om nieuwe technologieën, methodieken en concepten toe te passen in projecten en bij klanten. Je vindt het leuk om kennis te delen met collega’s, klanten en vakgenoten. Je bent een ware professional en ambassadeur voor CIMSOLUTIONS. Je voelt je thuis in een informele, collegiale en professionele sfeer waar de aandacht voor de klant en voor de medewerker

Bekijk vacature »

Medior Laravel ontwikkelaar

Organisatie Het bedrijf werkt aan de meest gave online succes story’s. Dit wordt gedaan vanuit een uniek kantoor pand waarin iedereen informeel en gezellig met elkaar om gaan. De organisatie pakt het gehele traject aan, van strategie en concept tot en met development. Dit is het typische verhaal van een grote Techgigant. Ooit zijn ze begonnen kleine zolderkamer onderneming waar wat vrienden met elkaar gave dingen maakte. Nu heel wat jaren later staat er een gevestigde onderneming waar alleen maar gepassioneerde developers werken. In teamverband wordt er gewerkt aan mooie projecten voor de grootste namen. Functie Jij komt als PHP-programmeur

Bekijk vacature »

Junior Developer met interesse in PHP

Functieomschrijving Ben jij een junior developer die klaar is voor een nieuwe uitdaging? Wil jij de kans om jezelf verder te ontwikkelen op het gebied van PHP? Lees dan snel verder en reageer! Her- en uitbouwen van systemen met PHP; Onderhouden van systemen in PHP; Ontwikkelen van development skills. Functie-eisen Afgeronde HBO of WO opleiding, liefst in de richting van Informatica; Je hebt minimaal 1 tot 2 jaar ervaring als Developer bijv. in de talen Java, C++ of .NET; Indien je ervaring het met PHP is dat natuurlijk nog mooier!; Je hebt ervaring met object georiënteerd programmeren; Ervaring met SOAP

Bekijk vacature »

Junior PHP Developer

Organisatie Het bedrijf zelf is nu 12 jaar geleden ontstaan met als doel alles wat de ondernemer kan bedenken op technisch vlak te kunnen maken. Dat is gelukt en nog veel meer! Inmiddels zijn ze gegroeid tot een team van 40 mensen die elke dag hard werken maar zeker ook plezier hebben met elkaar. De klanten die dit bedrijf heeft varieert sterk. Zo kan de gemiddelde MKB’er klant worden maar hebben ze bijvoorbeeld ook maatwerkapplicatie’s gebouwd voor bekendere multinationals. Dit bedrijf is zowel nationaal als internationaal actief! Functie Je komt te werken op de IT afdeling die is verdeeld in

Bekijk vacature »

Xamarin Developer regio Utrecht

‘Duurzaamheid is geen begrip. Duurzaamheid is een mindset’ Hoe vaak stap je s’ ochtends de auto in op weg naar je werk, denkend aan hoe slecht het is voor het milieu dat je weer de auto pakt. Je weet dat je ook prima met de fiets naar je werk kan, maar het is zo lekker snel en gemakkelijk. Maar heb je er weleens over nagedacht hoeveel CO2 je de lucht in slingert door dat ritje naar je werk? En hoeveel calorien je verbrandt als je een keer de fiets pakt? Men zegt altijd dat milieubewust handelen een kwestie is van

Bekijk vacature »
Daniel van Seggelen

Daniel van Seggelen

08/04/2017 22:45:49
Quote Anchor link
Ik gebruik: https://github.com/filamentgroup/loadCSS

en in de header laad ik 7 css bestanden.
Het punt is dat de css niet laad zoals het hoort. Bepaalde elementen hebben bijv een display:none, maar die worden toch eerst getoond voor 1 seconde.
Als ik het niet doe dan laad hij wel goed, maar duurt het laden langer.

Weet iemand hoe ik zeker kan zijn dat de css net zo geordend laad als de standaard wijze?
 
PHP hulp

PHP hulp

18/08/2019 20:14:28
 
Ozzie PHP

Ozzie PHP

08/04/2017 23:03:36
Quote Anchor link
Dus als ik je goed begrijp ... je het 7 CSS-bestanden? En omdat het laden daarvan te lang duurt, gebruik je een tool waarmee je de bestanden asynchroon inlaadt. Eerst de bestanden die per se nodig zijn, en daarna bestanden die minder relevant zijn?
 
Daniel van Seggelen

Daniel van Seggelen

08/04/2017 23:18:45
Quote Anchor link
Ja ik krijg dat door van goog pagespeed insight, dat ze boven de vouw geladen worden. Dit probeer ik dus te verhelpen met die tool.
 
Ozzie PHP

Ozzie PHP

08/04/2017 23:22:32
Quote Anchor link
Aha ... nu ken ik de situatie niet ... maar is het niet veel handiger om het oorspronkelijke probleem op te lossen (het gebruik van maar liefst 7 css bestanden) in plaats van de boel te 'fixen' met een noodgreep?
 
Daniel van Seggelen

Daniel van Seggelen

08/04/2017 23:41:06
Quote Anchor link
Nou ik kan alle css wel in 1 bestand zetten en hij is geminimaliseerd, maar ik wil dus geen render blocking hebben, maar dat heb ik nog steeds op de standaard wijze.
Dat maakt mijn website langzamer met laden en dat wil ik absoluut niet.
Alles wat ik kan doen om de site sneller te laden, daar ga ik voor. Dat is geen noodgreep, dat is gewoon de beste manier vinden om mijn site sneller te maken.
Asynchroon laden,
 
Ben van Velzen

Ben van Velzen

08/04/2017 23:57:52
Quote Anchor link
Correctie. Dat is *een* manier. Je kan ook kijken naar het verwijderen van zinloze css, gebruikmaken van handige(re) css regels etc. Daarnaast: wat is de werkelijke vertraging die je ziet?
 
Ozzie PHP

Ozzie PHP

08/04/2017 23:58:51
Quote Anchor link
>> render blocking

Wat bedoel je hier precies mee?

De meer algemene vraag luidt ... hoe kom je dan in godsnaam aan 7 CSS-bestanden ... het lijkt me dat je eerder daar het probleem moet oplossen. Werk je met een of andere framework/cms in combinatie met een thema ofzo?
 
Daniel van Seggelen

Daniel van Seggelen

09/04/2017 01:13:43
Quote Anchor link
Nee ik werk niet met een framework , alles custom made.
Met render blocking lees hier meer: https://varvy.com/pagespeed/render-blocking-css.html , google werkt nog altijd:)

Eerst alles laden voordat er iets weergegeven word komt het op neer.
Ok ik heb er nu 5 css van gemaakt, het ging even om het idee, niet om hoeveel csses er zijn. Zoals ik eerder aangaf, ook al combineer ik alle 7 css in 1 bestand, dan nog heb je met render blocking te maken. Ik wil dus weten of ik hem sneller kan maken om dit op te lossen.

Ik probeerde zelf een tool te schrijven in PHP om met preg_match te kijken welke css classes ik niet meer gebruik. Uiteraard ga ik daar ook achteraan.
 
Ben van Velzen

Ben van Velzen

09/04/2017 01:21:43
Quote Anchor link
Om merkbare blocking te zien heb je toch echt te maken met een gigantische hoeveelheid CSS. Hoe heb je dat voor elkaar gekregen?
 
Ozzie PHP

Ozzie PHP

09/04/2017 01:47:35
Quote Anchor link
>> Om merkbare blocking te zien heb je toch echt te maken met een gigantische hoeveelheid CSS. Hoe heb je dat voor elkaar gekregen?

Precies ... dit dus.
 
Daniel van Seggelen

Daniel van Seggelen

09/04/2017 10:04:26
Quote Anchor link
Ok, geminimaliseerd komt alles bij elkaar uit op 200kb.
het meeste in style.css, zowel voor alle apparaten, mobiel tab, portrait/landscape etc en het is een vrij groot project.

Deze bestanden zijn het, nu laat ik het elk apart zien:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<link rel="preload" href="<?=HTML_ROOT?>css/style.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="<?=HTML_ROOT?>css/style.css"></noscript>


<link rel="preload" href="<?=HTML_ROOT?>css/font-awesome.min.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="<?=HTML_ROOT?>css/font-awesome.min.css"></noscript>

<link rel="preload" href="<?=HTML_ROOT?>css/jquery.mmenu.all.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="<?=HTML_ROOT?>css/jquery.mmenu.all.css"></noscript>

<link rel="preload" href="<?=HTML_ROOT?>css/jquery.mmenu.positioning.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="<?=HTML_ROOT?>css/jquery.mmenu.positioning.css"></noscript>

<link rel="preload" href="<?=HTML_ROOT?>css/jquery-ui.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="<?=HTML_ROOT?>css/jquery-ui.css"></noscript>


En 200 kb is niet zoveel. grote sites als bijv kieskeurig.nl gebruikt 1 css bestand van 250 kb geminimaliseert. Hun krijgen geen render blocking melding van google pagespeed insight.
Dus vraag me dan af waar dit aan ligt.
Gewijzigd op 09/04/2017 10:21:41 door Daniel van Seggelen
 
Ben van Velzen

Ben van Velzen

09/04/2017 11:26:43
Quote Anchor link
Vergelijk de opbouw van hun CSS eens met die van jou. Structuren qua overerving etc. Misschien valt er dan wel wat op.
 
Ward van der Put
Moderator

Ward van der Put

09/04/2017 11:45:18
Quote Anchor link
Zolang je nog 5 CSS-bestanden gebruikt, kun je die om te beginnen één voor één uitschakelen: dan zie je vanzelf bij welk uitgeschakelde CSS-bestand de snelheid merkbaar toeneemt.

De volgende stap is de knelpunten opsporen. Dat kan bijvoorbeeld via het tabblad Timeline in de developer tools van Google Chrome. Je ziet daar precies hoe een webpagina wordt opgebouwd. Als je Screenshots inschakelt, wordt ook de schermopbouw getoond, wat handig is als je meer visueel ingesteld bent: je ziet welk schermonderdeel de boel heeft opgehouden omdat het na een langere vertraging ineens opduikt.
Gewijzigd op 09/04/2017 11:50:28 door Ward van der Put
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.