Category Archives: Web

apex:page cache=”false”

Setting this to false will lead to increased bandwidth usage. Salesforce advises only setting to “false” during development or when truly necessary.  Also, there is another property “expires” which is closely related: Sites provide caching options that allow you to leverage the resources of our Content Delivery Network (CDN) partner to improve page load times and site performance, as well as help you avoid reaching bandwidth or service request time limits. Sites allows you to set the cache duration for each of your site pages and optimize content delivery to your end users.  A public Visualforce page on a Force.com Site may make a number of queries, or even call outs to external web sites. This will slow down the rendering of the page. You can ensure that page is rendered much snappier by configuring the page to be cached.
Control the caching behavior for your site by setting the Boolean cache attribute and integer expires attribute on each Visualforce page. By default, pages that do not have the cache attribute set are cached for ten minutes (600 seconds). Force.com uses a global content distribution network. For example, the first user to access the page in the UK will probably not hit the cache. Subsequent calls by that user, or any others in the UK, will hit the cache (provided that the page cache hasn’t expired). Use static resources to ensure other items your page references are also cached – like CSS and image files.
Be sure to use caution when caching pages that may display private information. For example let’s pretend you have a webform that creates a cookie and then autofills the form based on the cookie values when a user returns in the future. A page like this should not be cached. What will happen is if the page is not currently cached the associated Apex will run and autofill the form. This data will then reside in the form for the next 10 minutues or the length of the expires time. Anyone that visits the page while it is cached during this time will see the values that were populated by the Apex cookie values.

Latest Bootstrap Media Queries Breakpoints

As of now these are the best breakpoints to use:

/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
    
}

/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}


/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
    
}

Best practices for using font-weights

The CSS “font-weight” property is used to define the weight of a font, such as regular or bold. This article describes how to best use font families that have extended weights that may range from Extra Light all the way to Extra Black.

Here is how a regular and bold weight would be defined:

But for all other weights a numerical range from 100 to 900 is used. One of the challenges with web fonts is that most web browsers do not properly support font weights other than normal & bold. The following chart describes the possible mappings of weights to the numeric definitions:

  • 100    Extra Light or Ultra Light
  • 200    Light or Thin
  • 300    Book or Demi
  • 400    Normal or Regular
  • 500    Medium
  • 600    Semibold, Demibold
  • 700    Bold
  • 800    Black, Extra Bold or Heavy
  • 900    Extra Black, Fat, Poster or Ultra Black