strong textI am new to Sencha and I am evaluating it.
Every time I try to open a browser and visit the API page at docs.sencha.com/whatever ... it takes forever to load up.
I mean, what the hell is it doing at the back end? Is it taking that long to load up all the necessary extjs app files? Or is it loading me the whole API library while I am only try to see one page?
So far, I have gone through a couple of examples, and I like Sencha a lot . However, I have a concern about the loading speed in production, because the speed they load up the API scares me.
If you are experienced with Sencha, could you tell me what is going on at the back? Please don't say "API is 20MB big, takes time to load ...", because I only want to see one page per visit, i believe it is wrong to load me the whole API to initialize a page.
UPDATE ------------------------------------
I face this loading screen for 20-30 seconds everytime when I open the browser. IE only. Chrome and FF are fast??
UPDATE 2 ----------------------------------
I did a profiling for IE. Btween http://projects.sencha.com/auth/session?... and /architect/2guides/intro/README.js?... IE went to sleep for over 20 seconds blank doing nothing (as u can see from the highlighted blank gap in between the 2 rows in the picture), then suddenly came back and finish loading the rest of the page!
I copied those links 1 by 1 and load them up in a new IE window. They all individually came up in milliseconds, so there is no speed issue. It is just that, IE went to sleep for 20+ seconds (CPU monitor shows no activity) StranGe!
Since you're starting up, you should definitely start building your application using sencha cmd. This allows you to build a version of the extjs file that uses only the components that you use.
But as a side note. I use the full sencha api and it takes me less than 2 sec to load the whole API. I use the production version ext-all.js and ext-all.css and gzip everything. After the zipping, I get a file size of less than 500KB, which is like nothing actually.
EDIT:
I checked the API docs page. The total download size is less than 1 MB and that too cause there are a lot of icons which aren't combined as sprites. Hence the browser takes a lot of time in requesting the icons. That's why the page is slow.
For IE, well sencha can't do much about it. The browser itself is slow. Any webpage you load will suffer from the same problem. Not just sencha's. The page speed will improve if you do some optimizations. The size of the API isn't the problem.
Related
Attachment
I'm currently working on a website.
Attached is the part of the website that I can watch on my computer monitor.
Changed Display below is the what I want.
However, if I keep hitting 'ctrl+f5', the screen shows me either unchanged display or changed display.
I have no idea why it shows me two different types of screen.
As far as I know, 'ctrl+f5' deletes the cache and updates data but it is not for me.
Ridiculously, If I keep hitting 'f5', I can only have the changed display as I want.
I guess I have a problem on css because I get an error message: DevTools failed to load SourceMap: Could not load content for http://localhost:8090/asset/css/sub.css.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE.
Does anyone know the keys on this problem?
There's not enough info here for anyone to tell you how to fix your problem with any amount of certainty.
What do you mean by changed display? Just the website looking different? Or a different debug preview (like scaling your website down to a phone's screen size)?
If it looks different, that might just have to do with caching.
The difference between CTRL + F5 and just F5 is that CTRL + F5 doesn't use your browser's cache, instead fetching everything fresh from the server, whereas just F5 uses your browser's cache. Your browser generally keeps track of when it cached things and will automatically fetch data anew if the time of caching was too long ago.
The former generally takes longer to load, naturally, which might be why the website looks different, at least until everything has been loaded.
Other than that, CSS gets a little weird sometimes, applying styles in a weird order. This generally has to do with the order in which, and where in your HTML document you actually load your stylesheets. Generally, loading all of them in the head of the document is a good idea. Complete redefinitions of styles in separate stylesheets can get very weird, even if it should follow normal precedence (Thread on CSS precedence)
Though, again, you'll have to elaborate on your problem further, maybe provide some screenshots, for anyone to be able to definitively help you.
I have Ionic app that communicates with Laravel API server side. Thing that bothers me is that elements like buttons and pre-defined text show first, and then after a few milliseconds resources from API load.
I would like the whole page to have that same millisecond pause so that all resources load at the same time, because for instance, my POST call breaks if I click the button to place an order before the server resources are shown on screen.
I have no idea how to google that nor what code part would be useful to paste here, so if anyone had simmilar problem...
When I take a screenshot of a webpage with PhantomJS 1.9.8, I have a test case where the output is always a zero size file. I tried several debugging options with page.onError, I see some errors related with Facebook plugins and scripts, but nothing very helpful...
So when PhantomJS fails on rendering a page, is there a way to know what's going on above the status of the render() function?
URL: http://www.santenatureinnovation.com/verrues-un-nombre-incroyable-de-solutions/
The page is so big that it uses between 600 and 700 MB of RAM to render the image. The dimensions of the resulting image are 960 x 141524 (sic!). Make sure you have enough RAM and wait a little. It takes several seconds for the image to be rendered. The good thing is that JavaScript is single threaded and you don't have to add anything to wait for the rendering to finish, everything else freezes.
I tried it successfully with PhantomJS 1.9.7 and 1.9.8 (on windows) without special care to viewportSize or user agent string.
I've posted about this before but have been struggling to come up with a solution.
Basically I have a HTML5/jQuery app within my iPad app. Every time I load an image into the UIWebView (HTML App) the overall allocations in the profiler increases by about 2MB each time. This sounds about right because the image is approx 2MB's. I am using the data notation in the tag to load a Base64 image.
i.e.
When I load a certain number of images (page turns) the app will crash.
The app is an ebook viewer, so when I turn to a new (not previously loaded in current session) the allocations increase. But, if I turn back to a previiously loaded page the allocations don't increase and the page loads quicker than a new one. Every page turn sends a request to the database so i'm beginning to think the leak isn't in the iOS and that it could be in the HTML5 app.
Any ideas on this? I guess there could just as easily be a leak in the HTML app as there could be in iOS. How do I go about debugging this?
Any ideas greatly appreciated.
Thanks
HTTP and WebKit likes to keep a local copy of resources, just in case you will need it again. This may be what you encounter.
Check the answers to this question: Is it possible to prevent an NSURLRequest from caching data or remove cached data following a request?
This was die an unfixable issue with iOS 4.
Issue resolved itself after upgrading to iOS5.
I've been playing around with EasySlider and everything was working perfectly - until I viewed my site in IE9.
Instead of displaying the slider with 3 images sliding across, it displayed all 3 images sat one underneath the other, and a message at the bottom of the screen saying that scripts etc had been blocked and did I want to allow blocked content.
As I was using this in the hear of my website it pushed my whole site down the page and just looked stupid with the 3 banners on top of each other.
I realise I can get rid of this by unblocking the content, but that's not the point. I think this is the default security settings for IE so everyone that visits my site will see it like this for the first time (or everytime if they don't unblock the content).
So is there a way around this? Or at least a way that if the script is blocked only the first image is shown instead of all of them? This seems a pretty big flaw!
I had the same issue as you and found a very simple solution for it using CSS. All you need to do is copy and paste the line of CSS code below onto the screen.css stylesheet that came with the EasySlider 1.7 Plugin. I hope this helps.
#slider {
position:relative;
}
I found this solution at the "ClickNathan Handmade Websites".