JavaScript
Reducing load times and size of scripts and CSS-files
Web services that include a lot of scripts or costly style operations may be very slow, as a lot must be loaded in the background. Is there a way to make these pages load faster?
There are many different possibilities to answer this question. We will go top down beginning with the browser.
Most of the browsers support the html input tag of type "email" and most of them would automatically warn the user about a wrong format of the address. However there are many standards of email address pattern. Furthermore the user might disable the browser validation, so we should not rely on this.
The second station is the javascript of the browser. Probably the easiest way to validate the email address is to use a regular expression an match the input against this expression. However the user may disable the javascript or send a request in other way than browser. Therefore it's absolutely necessary to validate the email address on the server side. This might be done by a regular expression, but some more sophisticated systems would check the MX record of the domain given in the email address, to be sure it might be a real address of a real mail server.
Window.event does not exist in Firefox. Different browsers have different event models. Firefox handles the events slightly different IE and Chrome and for that reason it has not worked. A work-around is to pass the event as an argument to the function:<a onclick="testfunction(event);">
//...
</a>
testfunction(e){
evt = e || window.event;
//...
}
or use a library like jQuery to avoid dealing with all the differences between the browsers.
Taggings:
Import Javascript libraries into Angular 2
I had and still have not much experience in web engineering (Javascript, npm-Tool, …) when I started working with Angular 2. There I have a problem that normally one imports an angular-module with e.g. “import {Injectable} from '@angular/core';”. But I want to use the Javascript-library “cytoscape.js”. The problem now is, how to import it such that I can use it.
Taggings:
Display the developper option in an iOS device while running a React Native app.
The best way to solve this challenge would be follow the following steps:
1. Make sure that you have set the proper location for your Javascript code in your AppDelegate.m file. You can choose between load the cod from the development server that runs in your computer or from a pre-bundled file on disk.
2. Go to the menu Product > Scheme > Manage Schemes, and from there you can set the options you want to enable for every different scheme that your app has (Build, Run, Test, Profile...).
3. Make sure that you set the build configuration to Debug. This will enable the developer menu in the target.
4. If you want to access the developer menu you have to shake your phone and it'll automatically show up in your screen.
Taggings:
Deal with different versions of Node installed in your system.
The best way to deal with different versions of node is to install the Node Version Manager (nvm) using Homebrew.
You just need to write the following command in your terminal:
brew update
brew install nvm
mkdir ~/.nvm
nano ~/.bash_profile
and make sure that you add this to your .bash_profile:
export NVM_DIR=~/.nvm
source $(brew --prefix nvm)/nvm.sh
Now you can just use the command nvm from your terminal to simply install and manage new versions of Node in your computer.
Taggings:
Perform A/B testing using Javascript
On checkout page include small Javascript script which is going to send to server which button is clicked.
Create two versions of checkout page (both with different colors of ,,Cancel" button)
Serve each version to 50% of visitors (every second visitor gets one version).
Count how many times user clicked on each button. Version that has less clicks on ,,Cancel" button gives better solution for design of Cancel button.
Developing a blogger.com gadget that displays both, an image and the title of the most recent post
The steps do do so would be the following:
- Look up the internet for getting started documentation for blogger.com gadgets (Blogger documentation)
- Write a helloworld gadget and try to upload the gadget to your blog (add the helloWorld Gadget to your ftp, add it then to your layout by choosing "Layout" and clicking the following, at last enter an URL and hit the "add url" button)
- if the upload was successful look up how one can get the image link and the title of the most recent post programmatically
- search the web how to display an image and a title with xhtml
- search the web how to style the previsouly mentioned tags with css accordingly
- put the pieces together and test
- iterate until the desired outcomes are archieved
- upload the solution to your blog
In order to get a kick start, here the helloWorld.xml
<?xml version="1.0" encoding="UTF-8" ?>
Description of the structure:
- ModulePrefs: Here preferences for the gadget can be defined, which can then be used within your code
- your custom HTML, CSS and JavaScript all goes into the Content part. as CDATA
Taggings:
Pages
