2
* Copyright 2011 Google Inc.
4
* Licensed under the Apache License, Version 2.0 (the "License");
5
* you may not use this file except in compliance with the License.
6
* You may obtain a copy of the License at
8
* http://www.apache.org/licenses/LICENSE-2.0
10
* Unless required by applicable law or agreed to in writing, software
11
* distributed under the License is distributed on an "AS IS" BASIS,
12
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
* See the License for the specific language governing permissions and
14
* limitations under the License.
17
// Author: nikhilmadan@google.com (Nikhil Madan)
19
#ifndef NET_INSTAWEB_REWRITER_PUBLIC_LAZYLOAD_IMAGES_FILTER_H_
20
#define NET_INSTAWEB_REWRITER_PUBLIC_LAZYLOAD_IMAGES_FILTER_H_
22
#include "net/instaweb/htmlparse/public/html_element.h"
23
#include "net/instaweb/rewriter/public/common_filter.h"
24
#include "net/instaweb/rewriter/public/rewrite_driver.h"
25
#include "net/instaweb/rewriter/public/rewrite_options.h"
26
#include "net/instaweb/util/enums.pb.h"
27
#include "net/instaweb/util/public/string.h"
29
namespace net_instaweb {
31
class StaticAssetManager;
34
// Filter to lazyload images by replacing the src with a pagespeed_lazy_src
35
// attribute and injecting a javascript to detect which images are in the
36
// user's viewport and swapping the src back.
38
// This filter only works if the document has a head. It adds some javascript to
39
// the head that determines if an image is visible and adds a listener to the
40
// window scroll event. If an image is visible, it replaces the src and the
41
// pagespeed_lazy_src attributes.
43
// In order to immediately load images that are above the fold, we attach an
44
// onload event to each image. This onload event determines if the image is
45
// visible and immediately replaces the src with the pagespeed_lazy_src.
46
// Otherwise, the image is added to the deferred queue. Since the onload event
47
// is only fired if the image src is valid, we add a fixed inlined image to
48
// each image node we are deferring.
50
// When the user scrolls, we scan through the deferred queue and determine which
51
// images are now visible, and switch the src and pagespeed_lazy_src.
53
// Given the following input html:
58
// <img src="1.jpeg" />
66
// Javascript that determines which images are visible and attaches a
67
// window.scroll event.
71
// <img pagespeed_lazy_src="1.jpeg" onload="kImageOnloadCode"
72
// src="kBlankImageSrc" />
75
class LazyloadImagesFilter : public CommonFilter {
77
static const char* kImageLazyloadCode;
78
static const char* kImageOnloadCode;
79
static const char* kLoadAllImages;
80
static const char* kOverrideAttributeFunctions;
81
static const char* kIsLazyloadScriptInsertedPropertyName;
83
explicit LazyloadImagesFilter(RewriteDriver* driver);
84
virtual ~LazyloadImagesFilter();
86
virtual const char* Name() const { return "Lazyload Images"; }
88
static void InitStats(Statistics* statistics);
89
static void Terminate();
91
// Lazyload filter will be no op for the request if ShouldApply returns false.
92
static RewriterHtmlApplication::Status ShouldApply(RewriteDriver* driver);
93
static GoogleString GetLazyloadJsSnippet(
94
const RewriteOptions* options,
95
StaticAssetManager* static_asset_manager);
98
virtual void StartDocumentImpl();
99
virtual void EndDocument();
100
virtual void StartElementImpl(HtmlElement* element);
101
virtual void EndElementImpl(HtmlElement* element);
102
virtual void DetermineEnabled(GoogleString* disabled_reason);
104
// Clears all state associated with the filter.
107
static GoogleString GetBlankImageSrc(
108
const RewriteOptions* options,
109
const StaticAssetManager* static_asset_manager);
111
// Inserts the lazyload JS code before the given element.
112
void InsertLazyloadJsCode(HtmlElement* element);
114
// Inserts a script to override attributes of all the images that have been
115
// lazily loaded so far.
116
void InsertOverrideAttributesScript(HtmlElement* element,
117
bool is_before_script);
119
// The initial image url to be used.
120
GoogleString blank_image_url_;
121
// If non-NULL, we skip rewriting till we reach
122
// LazyloadImagesFilter::EndElement(skip_rewrite_).
123
HtmlElement* skip_rewrite_;
124
// Head element - preferred insertion point for scripts.
125
HtmlElement* head_element_;
126
// Indicates if the main javascript has been inserted into the page.
127
bool main_script_inserted_;
128
// Indicates whether we should abort rewriting the page.
130
// Indicates if the javascript to abort the rewrite has been inserted into the
132
bool abort_script_inserted_;
133
// The number of lazily loaded images early since the last time
134
// InsertOverrideAttributesScript was called.
135
int num_images_lazily_loaded_;
138
} // namespace net_instaweb
140
#endif // NET_INSTAWEB_REWRITER_PUBLIC_LAZYLOAD_IMAGES_FILTER_H_