Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
Google and other search engines have speed as a ranking factor. They think mobile sites should load below 1 second.
Different speed, mobile and desktop
Is there a good method to load the site with different speed? I can check with PHP what device that are used but nowdays sites are responsive with CSS.
Mobile site with speed
What is the "correct" way to make the mobile site much faster than the desktop version? How do I load the images differently when the site is responsive via CSS?
You can take a look on Yslow on website performance best practices and rules..
(taken from Yslow):
Minimize HTTP Requests
Use a Content Delivery Network
Avoid empty src or href
Add an Expires or a Cache-Control Header
Gzip Components
Put StyleSheets at the Top
Put Scripts at the Bottom
Avoid CSS Expressions
Make JavaScript and CSS External
Reduce DNS Lookups
Minify JavaScript and CSS
Avoid Redirects
Remove Duplicate Scripts
Configure ETags
Make AJAX Cacheable
Use GET for AJAX Requests
Reduce the Number of DOM Elements
No 404s
Reduce Cookie Size
Use Cookie-Free Domains for Components
Avoid Filters
Do Not Scale Images in HTML
Make favicon.ico Small and Cacheable
If you follow these already and still get a load time > 1s (you can check using this), you can look further on
Responsive Images,
there is a good read on that here,
which basically means depending on the width of the browser you serve different sizes of images, which makes sense because for example why would you serve a '3000px' image on a '320px' mobile browser?
How, you say? One simple example is by using User Agent strings to determine if it is from a mobile/tablet device.. and serve the appropriate size of images depending on it. Take note however that UA strings are not 100% accurate and can be spoofed.
** If you happen to be using PHP, there is this library called mobiledetect that might help you..
** If you want to detect if the user is using 3G/2G, this SO question might help..
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 2 years ago.
Improve this question
I have tried,
Single SPA
Web Components
But in both ways, i couldn't find a way to develop and deploy the Micro Front-ends separately and then refer those deployed micro-front ends in a wrapper web app.
In the examples i tried using the above methods, the micro front-ends are rendering in the wrapper web app but when served independently, they are not rendering as expected.
You can't do this with a plain static site solution. You have to use some back-end. The issue is that you need to provide a list of micro-frontend-applications (mfa) dynamically, so you have to alter at least something.
The simplest way to achieve this would be:
Create a script (lets name it Loader) that knows how to load scripts dynamically (see document.createElement).
Create an API endpoint that will return the list of scripts, that should be loaded. (here back-end appears)
Update Loader to use API to get the list of micro frontends you want to load.
Now, your the schema should be like this:
--> Index.html started
--> Loader do fetch for the list of the mfa scripts
--> Loader adds listed scripts dynamically
--> Applications start working
When you need to change the list of apps, you don't need to redeploy anything. Just change the API response (by updating the DB, config, or whatever you want) and it will work.
This is not ideal (very not ideal from a performance perspective, but will work for the plain static site).
The better way (if you have a back-end) is to generate the page on the fly and embed your scripts with applications dynamically on the server-side. It is much simpler and might be faster, cause you don't need to wait for a call to the API to get the mfa list.
Hope this helps.
P.S. Using dynamic script loading might be dangerous. If you decide to do the first way, don't forget to verify that all scripts are trusted. You might use Content-Security-Policy for example.
I'm trying to improve the page speed (and SEO) performance of my React app at https://bravos.co. You can see the results of the page speed test here: https://developers.google.com/speed/pagespeed/insights/?url=bravos.co
I'm stuck at 64/100 on mobile and 46/100 on desktop.
I've improved a number of things, but there's a lot that I'm just stuck on, and seems to be difficult to improve give it is a React app:
Eliminate render-blocking JavaScript and CSS in above-the-fold
content (this is mainly the bundle.js, which I can't eliminate given that it's the whole app)
Optimize CSS Delivery (This is relatively minor, but I'm still not sure how to do it in React)
Enable compression (I can gzip some things here, still looking for an easy way to gzip and deploy a random javascript file)
Leverage browser caching (this I can't figure out how to do in React, particularly since .htaccess doesn't seem to be used)
Any advice or thoughts here would be massively appreciated.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I am new to MEAN stack. I have seen Template engines being used while developing node JS apps and realized it can be used to make static documents dynamic by integrating values from server.
However, I see Angular JS facilitates same stuff. Then why use template engines ? Is it absolutely necessary to use them? Can angular completely replace them ?
I think you're on the right track simi. When starting with Angular it is tempting to do "double templating" - templating on the server side and on the client side. Unless you absolutely need the server to render HTML your server should just be an API, the usual REST services serving JSON. Expose an API and treat your Angular application like any other client (Android, iOS). To see an example of this approach in action check out the Angular Fullstack Yeoman generator.
There are valid reasons to want the server to render full HTML responses, SEO probably being the most common. Whether or not it is worth the extra effort is a design decision.
As with all questions that are "this" or "that" the answer is "it depends".
First of all they aren't exclusive, so there isn't a reason to choose between them, but you should try to use them in a predictable way in your code base
Server side templates are good because it's generally less complex and it reduces client compute costs. If a part of your page doesn't need to be dynamic on the client side, it's a good candidate for EJS. An example might be a dynamic menu in a CRM application where you'll only change the content with config updates.
Angular (and other client-side MVW frameworks) offer lots of great things really. The first immediate benefit is that you can easily load dynamic content on the client side, which can result in better responsiveness and reduce the complexity of the backend (assuming you already needed an API layer, you can get a lot of stuff for free). A good example would be an auto-refreshing homepage feed which reloading the whole page is a waste. But most of that we've had for a long time with AJAX. Angular also makes it easy to generate the template so you can, once again, write less code and (if done right) more readable, testable code.
I think the right answer is to use both as you see fit.
NO. Angularjs cannot be the replacement for template engine like EJS or Jade. You need to use any one of the template engine. If you like ejs templating engine then you may use your angularjs code inside that template. Just suppose this is your regular html and you're including angularjs in it.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question does not appear to be about a specific programming problem, a software algorithm, or software tools primarily used by programmers. If you believe the question would be on-topic on another Stack Exchange site, you can leave a comment to explain where the question may be able to be answered.
Closed 9 years ago.
Improve this question
i have an Educational website and i create always pdf files from my learning and ad them for download
but there is many learchers that download my files and reupload them somewhere else
i used google dmca but is there any way to Prevent from re-uploading my files?
One way is to use your .htaccess to prevent hotlinking, but even if you do that, you'll again have the problem that when someone views the document via an in-browser extension (e.g. Adobe Reader, Foxit PDF Reader), they can save it and you've lost control over what they can do with it. Or, depending on how you've set up your site, they can simply directly download it, leaving you again back at square one.
Hence, the solution is to bypass direct access to the document. And, there are a number of ways to do that, which varies based on technique and web software (platform) used.
However, since you didn't mention a particular platform or technology: you can use web controllers (MVC type controllers) to broker the dynamic viewing and displaying of the documents in tandem with a client-side tool / plugin to do the displaying for you (much like Scribd).
However, Scribd uses a proprietary Flash PDF viewer called iPaper, and while it isn't available for use, you can find many other alternatives on the web. One that comes highly recommended (there's even a tag on SO for it) is FlexPaper, an open source plugin that implements a client-side web-based PDF viewer - which I think will suit your needs perfectly (from here):
This project provides a light weight document viewer component
enabling PDF files to be viewed without having any PDF reader software
installed. This project provides both Flex library and stand-alone web
version.
Here are some demos of it in action:
http://flexpaper.devaldi.com/demo/
Sorry, by mistake posted partial comment. Anyway...
Why do you afraid of reuploading of your files ? Put links to original site into the PDF and get profit of this. More copies, more downloads, more popularity for your resource. If you indeed would like to make PDFs available from your site only, you have to hide files from users and provide some functionality to read them from your web site only (you can use existing sites of this type). That makes duplicating of your resources to be harder task, but be ready that many users reject to read it this way.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
We're the developers of a relatively complex non-game iPhone 3 application, and we're beginning an ambitious rewrite to take better advantage of iOS 4. There's a significant social element to the app, so we started thinking that we'd like to make it available on as many modern mobile platforms as possible:
iPhone/iOS
Android
Windows Phone
BlackBerry OS
Symbian
There are several approaches to cross-platform development, and they all have limitations. No solution manages to take advantage of all a device's functionality the way a native application can. Given the complexity of our app, I'd simply like to maximize "logical" code reuse without resorting to a cross-platform framework. I'm envisioning tools that will make developing and testing apps against multiple platforms a little more seamless. What can we do to make developing on 5 platforms take less than 5 times the effort?
Push as much of the functionality as you can back to a shared web server, and try to make only the UI specific to the platform.
I know you said no cross-platform frameworks, but perhaps something to look at:
Write all the core logic in javascript. Unit test that at will. Then use tools like Appcelerator to turn that logic into native code.
Then import that logic code into your native platform projects for each of those platforms, and build out the other features you feel can't be achieved properly in any other way.
For platforms they don't support right now, you might be able to find a js to native code converter, or indeed a way of hosting a js environment within those platforms.
None of these will play nice together. It's not in their perceived best interest to do so.
The best bet is to dumb everything down and keep it simple. Simplicity always wins when you are trying to sandbox multiple hostile interests.
Look to XML for all data, and then have 5 binaries to read it or push it all to a web server via PHP. All these mobile platforms will function nicely with XML because it's in their best interest to do so. Worry about branding and appearances AFTER you get the core functionality off the ground.
NOTE: Javascript is the last thing you should be looking at in the beginning. It rarely plays nicely on all platforms in the same way. So make sure that your JS layer is independent of your data layer. DO NOT INTEGRATE THEM. That would be bad. You want your Android JS to be potentially different than the JS you push on the Blackberry for example. Because you won't know how quirky it will end up being until you try it out and test your methods.
I agree with Beth. I have developed a product based on the same thought process. I have a java server running on a socket, which has a client library that client app's use to connect to the server. The client abstracts out the socket piece and provides easy api's for client apps to call.
The server is equipped to handle multiple client connections in parallel, thread pool concept.
Now, since it will be a java client library, you can only run this on android. To get this working on other platforms, you can run this client piece on J2EE. This way you create a third middle layer. All other platforms can then connect using the browser.
With this done, you can now use JSON to Object libraries to expose your object (on the server side) to JSON. I haven't done this yet, but will do it in a few weeks.
Btw, I just cant get myself to use any cross platform frameworks. They promise the world, and dont mention any of their limitations upfront. Its painful towards the end of your product/app release to find out all these limitations/hidden costs.
Well, you can look at JQTouch, SensaTouch or maybe wait for a while to see the jqueryformobile to finally get published. If you are not in a hurry, I would already start working in jQuery, since two out of three from this list are (will be) based on jQuery as plugins
I'm currently thinking to this problem , and my solution would be to put all the logic server side and use an approach like Model-View-Presentation, a series of events fired by the UI that should instead be specific for the client