htmljs icon indicating copy to clipboard operation
htmljs copied to clipboard

CSS loading delay to be applied

Open findborg opened this issue 10 years ago • 2 comments

I thought you should know that I was testing the script/css loader out. I found that it is awesome that, even though the script is located at the base of the page the css was loaded in the head. However, the bad part was that there was a delay between page content rendering and css being applied. I am sure that this would not effect css rendering coupled with htmljs. I do not consider this a bug. But, it is an issue..

findborg avatar Nov 24 '14 13:11 findborg

Here is an example, the difference was I was loading the main css file before.

// Don't load a script if it has already been loaded
html.config.allowDuplicate = true;
   //define styles and scripts path  

html.scripts({ vunit: '/dist/js/libs/v-unit-min.js', lazysizes: '/dist/js/libs/lazysizes.min.js',
googlejquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js',
waves: '/dist/js/libs/waves/waves.min.js', fullpage: '/dist/js/libs/fullpage/jquery.fullPage.min.js'
});

// Load stylesheet(s)
html.styles({
    'fP': '<?php echo $BASE; ?>/dist/js/libs/fullpage/jquery.fullPage.css'
});
//render scripts  
html.scripts.render('waves').done(function(){  
//Do something when test-library has been loaded  
Waves.displayEffect();
}).then('lazysizes').then('googlejquery').then('vunit').then('fullpage');


//render css  
html.styles.render('fP');  

findborg avatar Nov 24 '14 13:11 findborg

CSS loader is not widely used. It is just a small utils. I think every initial CSS file should be loaded in the head. The dynamic should be loaded after some events.

nhanfu avatar Nov 24 '14 15:11 nhanfu