<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:media="http://search.yahoo.com/mrss/">
  <channel>
    <title>效能優化｜林鼎淵 Dean Lin</title>
    <link>https://deanlin.net/tags/%E6%95%88%E8%83%BD%E5%84%AA%E5%8C%96/</link>
    <image><url>https://deanlin.net/images/author_hu_aa256fc934e9a932.jpg</url><title>效能優化｜林鼎淵 Dean Lin</title><link>https://deanlin.net/tags/%E6%95%88%E8%83%BD%E5%84%AA%E5%8C%96/</link><width>144</width><height>144</height></image>
    <description>林鼎淵（Dean Lin）的部落格：生成式 AI 企業內訓講師、外商資安公司軟體專家、7 本書作者。400 多篇文章用白話分享生成式 AI 實戰、Claude Code 與 Vibe Coding 教學、團隊合作與職場成長。</description>
    <generator>Hugo</generator>
    <language>zh-tw</language>
    <copyright>© 2020–2026 林鼎淵 Dean Lin</copyright>
    <lastBuildDate>Thu, 01 Oct 2020 09:42:52 +0800</lastBuildDate>
    <atom:link href="https://deanlin.net/tags/%E6%95%88%E8%83%BD%E5%84%AA%E5%8C%96/index.xml" rel="self" type="application/rss+xml" />
    <item>
      <title>【Day16】不藏私，加上5行程式就能優化爬蟲的小技巧 ＆ 學會爬蟲，之後呢？</title>
      <link>https://deanlin.net/blog/202010/fb-ig-crawler-day-16/</link>
      <pubDate>Thu, 01 Oct 2020 09:42:52 +0800</pubDate>
      <guid>https://deanlin.net/blog/202010/fb-ig-crawler-day-16/</guid>
      <dc:creator>林鼎淵</dc:creator>
      <category>技術教學</category>
      <description>1.1 優化分成哪些面向?1.2 優化執行效率及穩定度1.3 背景執行並減少記憶體的消耗</description>
      <media:content url="https://deanlin.net/blog/202010/fb-ig-crawler-day-16/images/cover_hu_1e98c29409e2512e.jpg" medium="image" type="image/jpeg" width="1200" height="675" />
      <content:encoded><![CDATA[<blockquote>
<p>當技術為你的生活帶來便利，他才有存在的意義</p>
</blockquote>
<h2 id="為什麼寫這篇文章">為什麼寫這篇文章<a class="h-anchor" href="#%e7%82%ba%e4%bb%80%e9%ba%bc%e5%af%ab%e9%80%99%e7%af%87%e6%96%87%e7%ab%a0" aria-label="這個段落的連結"></a></h2>
<ol>
<li>如果你跟著這幾天的教學走還是遇到一些莫名其妙的問題，希望在今天的文章有得到你想要的解答</li>
<li>這幾天所教的技巧足以讓你爬下絕大多數的網頁資訊了，<mark>學習爬蟲只是一個過程，我們的目標是希望能靠這些數據給我們帶來便利</mark>，所以今天也分享一些思路給大家</li>
</ol>
<hr>
<h2 id="今日目標">今日目標<a class="h-anchor" href="#%e4%bb%8a%e6%97%a5%e7%9b%ae%e6%a8%99" aria-label="這個段落的連結"></a></h2>
<h3 class="h-nomark" id="1-優化爬蟲">1. 優化爬蟲<a class="h-anchor" href="#1-%e5%84%aa%e5%8c%96%e7%88%ac%e8%9f%b2" aria-label="這個段落的連結"></a></h3>
<p>1.1 優化分成哪些面向?</p>
<p>1.2 優化執行效率及穩定度</p>
<p>1.3 背景執行並減少記憶體的消耗</p>
<h3 class="h-nomark" id="2-學會爬蟲之後呢">2. 學會爬蟲，之後呢？<a class="h-anchor" href="#2-%e5%ad%b8%e6%9c%83%e7%88%ac%e8%9f%b2%e4%b9%8b%e5%be%8c%e5%91%a2" aria-label="這個段落的連結"></a></h3>
<hr>
<h2 class="h-nomark" id="1-優化爬蟲-1">1. 優化爬蟲<a class="h-anchor" href="#1-%e5%84%aa%e5%8c%96%e7%88%ac%e8%9f%b2-1" aria-label="這個段落的連結"></a></h2>
<p>昨天我們已經完成爬蟲所需要的功能了，下一步要思考的是如何優化</p>
<h3 class="h-nomark" id="11-優化分成哪些面向">1.1 優化分成哪些面向?<a class="h-anchor" href="#11-%e5%84%aa%e5%8c%96%e5%88%86%e6%88%90%e5%93%aa%e4%ba%9b%e9%9d%a2%e5%90%91" aria-label="這個段落的連結"></a></h3>
<p>前面<a href="https://deanlin.net/blog/202009/fb-ig-crawler-day-13/">【Day13】refactor-重構程式碼，讓合作夥伴對你比讚</a>在討論如何讓你在開發上更有效率，原則上不影響輸出的結果；而今天討論的優化是一個多面向的問題，我把他區分成<mark>顯性及隱性</mark>兩種：</p>
<ul>
<li><strong>顯性</strong>：使用者<mark>肉眼可見</mark>
<ul>
<li>改善使用者操作流程、介面</li>
<li>程式執行過程的畫面優化</li>
</ul>
</li>
<li><strong>隱性</strong>：使用者覺得自己的<mark>電腦變順</mark>了(不過他們通常不會聯想到是程式優化了)
<ul>
<li>更好地執行效率</li>
<li>使用更少的記憶體</li>
<li>執行的穩定性</li>
</ul>
</li>
</ul>
<p>優化是一條沒有盡頭的路，上面我只是提了幾個常見要注意的點而已，接下來我們就來實際優化現在的爬蟲吧～</p>
<hr>
<h3 class="h-nomark" id="12-優化執行效率及穩定度">1.2 優化執行效率及穩定度<a class="h-anchor" href="#12-%e5%84%aa%e5%8c%96%e5%9f%b7%e8%a1%8c%e6%95%88%e7%8e%87%e5%8f%8a%e7%a9%a9%e5%ae%9a%e5%ba%a6" aria-label="這個段落的連結"></a></h3>
<ul>
<li>
<p><strong>遇到的問題</strong></p>
<ol>
<li>在 driver.wait 加上等待時間後偶爾還是會出現登入失敗或是抓不到追蹤人數的問題</li>
<li>在爬蟲的時候會影響到我看 youtube 的流暢程度</li>
</ol>
</li>
<li>
<p><strong>判斷造成的原因</strong></p>
<ol>
<li>本身的<mark>網路速度太慢</mark>，造成網頁過了 driver.wait 的等待時間後依舊還沒完成載入</li>
<li>FB、IG 粉專都是<mark>充滿圖片的頁面</mark>，載入這些資源時消耗太多流量</li>
</ol>
</li>
<li>
<p><strong>優化的方式</strong><br>因為本專案<mark>爬蟲所分析的內容都跟圖片無關，所以只要不載入這些資源</mark>就有以下好處：</p>
<ol>
<li>減少瀏覽器使用流量</li>
<li>減少瀏覽器載入時間</li>
</ol>
<p>想要知道如何不載入圖片，你可以在 Google 搜尋 <strong>selenium chrome參數</strong> ，有很多熱心的大神已經幫你整理好常用的參數了</p>
<ul>
<li>
<p>打開 <strong>initDrive.js</strong> 在 chrome 的 option 加入<mark>不載入圖片</mark>的參數</p>
<div class="highlight"><pre tabindex="0" style="color:#e6edf3;background-color:#0d1117;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code class="language-javascript" data-lang="javascript"><span style="display:flex;"><span>options.addArguments(<span style="color:#a5d6ff">&#39;blink-settings=imagesEnabled=false&#39;</span>)<span style="color:#8b949e;font-style:italic">//不加載圖片提高效率
</span></span></span></code></pre></div><p>加上這段程式後，在專案資料夾的終端機(Terminal)執行指令 <strong>yarn start</strong> ，便可以很明顯的感受到<mark>網頁載入速度變快很多，並且所有圖片都沒有載入</mark>(下圖)</p>
<p><img src="https://deanlin.net/blog/202010/fb-ig-crawler-day-16/images/fb-ig-crawler-day-16-01.webp" width="1024" height="671" alt="1.2 優化執行效率及穩定度（圖 1）" fetchpriority="high" decoding="async"></p>
</li>
</ul>
</li>
</ul>
<hr>
<h3 class="h-nomark" id="13-背景執行並減少記憶體的消耗">1.3 背景執行並減少記憶體的消耗<a class="h-anchor" href="#13-%e8%83%8c%e6%99%af%e5%9f%b7%e8%a1%8c%e4%b8%a6%e6%b8%9b%e5%b0%91%e8%a8%98%e6%86%b6%e9%ab%94%e7%9a%84%e6%b6%88%e8%80%97" aria-label="這個段落的連結"></a></h3>
<ul>
<li><strong>遇到的問題</strong>
<ol>
<li>有時爬蟲執行到一半手賤點一下爬蟲瀏覽器導致程式拋出例外</li>
<li>爬蟲執行時候的畫面一直閃好煩</li>
<li>在記憶體 8G 的電腦執行爬蟲時覺得電腦變得很頓</li>
</ol>
</li>
<li><strong>判斷造成的原因</strong>
<ol>
<li>人有時控制不住自己的手</li>
<li>執行爬蟲時<mark>干擾到使用者的日常工作</mark></li>
<li><mark>chrome 吃太多記憶體</mark></li>
</ol>
</li>
<li><strong>優化的方式</strong><br>在爬蟲每個步驟及功能都穩定後，其實不需跳出瀏覽器視窗來觀察他的動作，<mark>讓瀏覽器在背景執行不但不會干擾使用者工作更能減少記憶體的浪費</mark>
<ul>
<li>
<p>打開 <strong>initDrive.js</strong> 並在 chrome 的 option 加入<mark>不打開瀏覽器視窗</mark>的參數如下</p>
<div class="highlight"><pre tabindex="0" style="color:#e6edf3;background-color:#0d1117;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code class="language-javascript" data-lang="javascript"><span style="display:flex;"><span>options.addArguments(<span style="color:#a5d6ff">&#39;--headless&#39;</span>)<span style="color:#8b949e;font-style:italic">//瀏覽器不提供頁面觀看，linux下如果系統是純文字介面不加這條會啓動失敗
</span></span></span><span style="display:flex;"><span>options.addArguments(<span style="color:#a5d6ff">&#39;--log-level=3&#39;</span>)<span style="color:#8b949e;font-style:italic">//這個option可以讓你跟headless時網頁端的console.log說掰掰
</span></span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#8b949e;font-style:italic">//下面參數能提升爬蟲穩定性    
</span></span></span><span style="display:flex;"><span>options.addArguments(<span style="color:#a5d6ff">&#39;--disable-dev-shm-usage&#39;</span>)<span style="color:#8b949e;font-style:italic">//使用共享內存RAM
</span></span></span><span style="display:flex;"><span>options.addArguments(<span style="color:#a5d6ff">&#39;--disable-gpu&#39;</span>)<span style="color:#8b949e;font-style:italic">//規避部分chrome gpu bug
</span></span></span></code></pre></div><p>設定完這些後，在專案資料夾的終端機(Terminal)執行指令 <strong>yarn start</strong> ，就會發現<mark>爬蟲變成背景執行，並且電腦順暢許多</mark></p>
</li>
</ul>
</li>
</ul>
<hr>
<h2 class="h-nomark" id="2-學會爬蟲之後呢-1">2. 學會爬蟲，之後呢？<a class="h-anchor" href="#2-%e5%ad%b8%e6%9c%83%e7%88%ac%e8%9f%b2%e4%b9%8b%e5%be%8c%e5%91%a2-1" aria-label="這個段落的連結"></a></h2>
<p><mark>原本我打算用兩天的文章來教取得當日貼文數量的方法，但文章寫完後就刪掉了，因為讀者完全有能力用這幾天所教的技術自行實踐這項功能；我希望用這30天分享更多不同的技術及有幫助的觀念</mark></p>
<blockquote>
<p><strong>授人以魚不如授人以漁</strong></p>
<p>使用模擬瀏覽器來爬蟲我認為是最符合初學者的，你不用去分析複雜的 api，去猜裡面的參數是甚麼意義</p>
<p>你需要做的只是把你平常操作的流程用程式的方式來替你做一遍，然後抓取你所需要的資訊</p>
<p>我寫的文章只是爬蟲的技巧的冰山一角，但只要有了開頭以及研究的方向我相信你是有能力獨立完成其他網頁的爬蟲</p>
</blockquote>
<p>現在人工智慧流行，大數據當道，爬蟲是取得大數據的方法之一，你能透過這些數據分析的東西太多了，我在這裡簡單舉例：</p>
<ul>
<li><strong>追蹤人數爆減/爆增</strong>
<ul>
<li>是因為某一篇貼文引起的嗎?</li>
<li>當天是否有媒體新聞的報導?</li>
<li>粉專經營者是否有特殊決策?</li>
</ul>
</li>
<li><strong>發文頻率與追蹤人數的關係</strong>
<ul>
<li>發文頻率是否與追蹤人數成長正相關</li>
<li>怎麼樣的發文頻率是最恰當的</li>
<li>不同行業的發文頻率比較</li>
</ul>
</li>
<li><strong>貼文按讚與回應</strong>
<ul>
<li>什麼樣的貼文會獲得最多迴響</li>
<li>獲得最多讚的貼文有什麼共同特徵</li>
</ul>
</li>
</ul>
<p>隨便舉的例子都能獨立出來都能成為一篇論文或是商品，<mark>爬蟲是一個很強的武器，但這把武器的強度要看使用者如何發揮他</mark>，我想會看這系列教學文章的讀者心中都有想要爬蟲的目標，開始動手實作吧！</p>
<p><em>再次提醒，技術沒有善惡，人的使用方式才會有善惡，希望這份技術可以幫大家節省時間以及避免重工；如果你把它拿來盜取智慧財產、個人檔案及機敏資訊請自行負擔後續法律責任</em></p>
<hr>
<blockquote>
<p><strong>筆者碎碎念</strong></p>
<p>我希望看完文章的讀者能夠吸收到問題思考的方式，不要只是單純的 copy &amp; paste ，這樣對技術長期來講是在累積負債</p>
<p>如果你是程式的新手，你可以透過修改一些參數來看看結果會有什麼樣的變化，少加哪些參數是不是真的會有錯誤</p>
<p>不要害怕犯錯，因為學習程式的路上幾乎不存在一條完美的道路</p>
<p>你現在滿意的程式往往在幾個月後你會覺得當時怎麼寫的這麼爛</p>
<p>當你誕生出這個想法的時候就是成長了</p>
</blockquote>
<hr>
<h3 class="h-nomark" id="-下個階段">⏭️ 下個階段<a class="h-anchor" href="#-%e4%b8%8b%e5%80%8b%e9%9a%8e%e6%ae%b5" aria-label="這個段落的連結"></a></h3>
<p>關於使用網頁爬蟲的技術文章就分享到今天，接下來我們要來研究 <mark>爬蟲資料如何儲存</mark> ，敬請期待</p>
<hr>
<h3 id="ℹ-專案原始碼">ℹ️ 專案原始碼<a class="h-anchor" href="#%e2%84%b9-%e5%b0%88%e6%a1%88%e5%8e%9f%e5%a7%8b%e7%a2%bc" aria-label="這個段落的連結"></a></h3>
<ul>
<li>今天的完整程式碼可以在<a href="https://github.com/dean9703111/ithelp_30days/tree/master/day16">這裡</a>找到喔</li>
<li>我也貼心地把昨天的把昨天的程式碼打包成<a href="https://github.com/dean9703111/ithelp_30days/raw/master/sampleCode/day15_sample_code.zip">壓縮檔</a>，你可以用裡面乾淨的環境來實作今天json改寫的部分喔
<ul>
<li>請記得在終端機下指令 <strong>yarn</strong> 才會把之前的套件安裝</li>
<li>windows需下載與你chrome版本相同的<a href="http://chromedriver.storage.googleapis.com/index.html">chrome driver</a>放在專案根目錄</li>
<li>調整.env檔
<ul>
<li>填上FB登入資訊</li>
<li>填上FB版本(classic/new)</li>
<li>填上IG登入資訊</li>
</ul>
</li>
<li>調整fanspages資料夾內目標爬蟲的粉專網址</li>
</ul>
</li>
</ul>
<hr>
<h3 id="參考資源">參考資源<a class="h-anchor" href="#%e5%8f%83%e8%80%83%e8%b3%87%e6%ba%90" aria-label="這個段落的連結"></a></h3>
<ol>
<li><a href="https://stackoverflow.max-everyday.com/2019/12/selenium-chrome-options/">selenium啓動Chrome的進階配置參數</a></li>
</ol>
<blockquote>
<p><em>免責聲明:文章技術僅抓取公開數據作爲研究，任何組織和個人不得以此技術盜取他人智慧財產、造成網站損害，否則一切后果由該組織或個人承擔。作者不承擔任何法律及連帶責任！</em></p>
</blockquote>
<hr>
<blockquote>
<p><img src="https://deanlin.net/blog/202010/fb-ig-crawler-day-16/images/fb-ig-crawler-day-16-02.webp" width="1024" height="233" alt="參考資源（圖 2）" loading="lazy" decoding="async"></p>
<p><strong>在許多人的幫助下，本系列文章已出版成書，並添加了新的篇章與細節補充：</strong></p>
<ul>
<li>加入更多實務經驗，用完整的開發流程讓讀者了解專案每個階段要注意的事項</li>
<li>將爬蟲的步驟與技巧做更詳細的說明，讓讀者可以輕鬆入門</li>
<li>調整專案架構
<ul>
<li>優化爬蟲程式，以更廣的視角來擷取網頁資訊</li>
<li>增加資料驗證、錯誤通知等功能，讓爬蟲執行遇到問題時可以第一時間通知使用者</li>
<li>排程部分改用 node-schedule &amp; pm2 的組合，讓讀者可以輕鬆管理專案程序並獲得更精確的 log 資訊</li>
</ul>
</li>
</ul>
<p><strong>有興趣的朋友可以到天瓏書局選購，感謝大家的支持。</strong></p>
<p><strong>購書連結</strong>：<a href="https://www.tenlong.com.tw/products/9789864348008">https://www.tenlong.com.tw/products/9789864348008</a></p>
</blockquote>
]]></content:encoded>
    </item>
  </channel>
</rss>
